最开始只有路由这个名词，路由就是一个单纯的URL，也就是一个链接地址，在浏览器里输入这个链接地址向服务器发起请求，服务器根据这个地址拿到对应的html文件返回给浏览器渲染（若html文件中引入了外部的js或css或其他文件资源，浏览器再一次发送请求，服务器再依次返回）。用户首次…

大家都知道，Vue2 里的响应式其实有点像是一个半完全体，对于对象上新增的属性无能为力，对于数组则需要拦截它的原型方法来实现响应式。 这种时候，Vue 提供了一个 api：this.$set，来使得新增的属性也拥有响应式的效果。 但是对于很多新手来说，很多时候需要小心翼翼的去判…

Vue3源码终于发布了！迫不及待的撸一下源码，看看Vue3和Vue2到底有什么区别。 对object类型使用defineProperty重写对象的getter和setter函数，在getter中收集依赖，在setter中触发依赖，以此实现响应式。但是要递归观测object中的所…

想要搞清楚这些，不得不看一波源码了。下面，请跟我从vue源码分析vue的响应式原理 其中划重点的 initState() 方法中进行了 props、methods、data、computed以及watcher的初始化。在instance/state.js中可以看到如下代码。 划…

推荐vue/cli的一个工具，零配置直接运行vue文件。 这篇文章分享一下computed计算属性的实现原理。首先分享一个工作中遇到的code review问题！利用3分钟先看一个例子： 在Vue实例初始化时，注意到有一个 initState 的方法。这个方法就是初始化 pro…

如果，你已经很熟悉vue框架，那么可以看看我对双向绑定的实现方式，如果你有更好的方式，非常欢迎分享出来。 如果，你不熟悉vue，则可以完整的看一遍，对于之后使用vue多少会有点帮助。 在分析它之前，我们可以先回答一个问题：为什么需要双向绑定呢？让我们把时间移到十年前，来看看前端…

Vue.js 最核心的功能有两个，一是响应式的数据绑定系统，二是组件系统。本文仅探究双向绑定是怎样实现的。先讲涉及的知识点，再用简化得不能再简化的代码实现一个简单的 hello world 示例。 ​ 访问器属性是对象中的一种特殊属性，它不能直接在对象中设置，而必须通过 def…

在开始虚拟DOM之前，让我们先来了解一下真实的DOM以及浏览器是怎么进行解析的。浏览器渲染引擎工作流程大致分为以下四类：创建DOM树 -> 生成render树 -> 布局render树 -> 绘制render树 创建DOM树：解析HTML生成DOM树 - 渲染引擎首先解析HTM…

最近开发的页面以及功能大都以表格为主，接口获取来的 JSON 数据大都是需要经过处理，比如时间戳需要转换，或者状态码的转义。对于这样的问题，各大主流框架都提供了类似于过滤的方法，在 Vue 中，一般是在页面上定义 filter 然后在模板文件中使用 | 进行处理。 这种方法和以…