3.Vue 的这个 DOM Diff 过程就是一个查找排序的过程，遍历 Virtual DOM 的节点，在 Real DOM 中找到对应的节点，并移动到新的位置上。不过这套算法使用了双向遍历的方式，加速了遍历的速度，更多请戳； 2.通过js的事件绑定程序 addEventLis…

但是，报错了。由于用cli创建项目时，使用的是runtime-only的构建方式，而在main.js 中，使用 template: '<div>{{this.message}}</div>'。 那么，引子中的案例只需要使用 render函数 来替代 template 就可以咯。

前言 组内代码走查偶然提起为什么this可以直接调用到data、methods和props、computed里的值，然后大家都有一些猜想，但没有一个明确的答案，为搞清这个问题，查阅了vue的源码，有一

没关系, 面试的时候总会问如何在Vue的实例上挂载一个方法/属性, 也就是Vue.prototype的小技巧, 但是突然有人问他俩有啥关系还真是新鲜. 我想应该是网上有文章写Vue.prototype.$xx是用法的, 但是没有说明Vue.use的用法以及Vue.prototy…

在上篇专栏中详解介绍了数据的监听过程。那么当监听到数据发生变化后又是如何通知视图更新，在 Vue 中是采用发布者订阅者这个设计模式来实现这个功能。其中发布者就是数据，订阅者就是 Watcher，另外还使用 Dep 来专门收集并管理订阅者，而订阅者还分为三种类型：render W…

... 小伙子：你为何 不按套路提问 呢？你应该这样问我：MVVM是什么，生命周期有哪些，双向绑定的原理啊，我对这些比较熟悉。 我：此时的我，被反问给愣住了（难道是我错了吗？我是农村来的不懂套路，还好我经历过风风雨雨，假装镇定下）。 看到网上vue相关的题量都非常少，完全不能满…

vue 的双向绑定原理及实现

本文以前端面试官的角度出发，对 Vue 框架中一些重要的特性、框架的原理以问题的形式进行整理汇总，意在帮助作者及读者自测下 Vue 掌握的程度。本文章节结构以从易到难进行组织，建议读者按章节顺序进行阅读，当然大佬级别的请随意。希望读者读完本文，有一定的启发思考，也能对自己的 V…

组件是 vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。一般来说，组件可以有以下几种关系： 如上图所示，A 和 B、B 和 C、B 和 D 都是父子关系，C 和 D 是兄弟关系，A 和 C 是隔代关系（可能隔多代）。 针对…