用户在某个列表页面选择筛选条件过滤出一份数据列表，由列表页面进入数据详情页面，再返回该列表页面，我们希望：列表页面可以保留用户的筛选（或选中）状态。keep-alive就是用来解决这种场景。当然keep-alive不仅仅是能够保存页面/组件的状态这么简单，它还可以避免组件反复创…

写过 Vue 的同学肯定体验过， .vue 这种单文件组件有多么方便。但是我们也知道，Vue 底层是通过虚拟 DOM 来进行渲染的，那么 .vue 文件的模板到底是怎么转换成虚拟 DOM 的呢？这一块对我来说一直是个黑盒，之前也没有深入研究过，今天打算一探究竟。 Vue 3 发…

1. Vue 响应式原理 Dep : 用于收集当前响应式对象的依赖关系,每个响应式对象包括子对象都拥有一个 Dep 实例（里面 subs 是 Watcher 实例数组）,当数据有变更时,会通过 dep.notify()通知各个 watcher。 watcher 中实例化了 de…

首先,上述类型的面试题在文档中可查,没有比官方文档更权威的答案了,其次这种问题没有太大价值,除了考察候选人的记忆力,最后,这种面试题只要用过vue的都知道,没有必要占用我们的篇幅. 我们的问题并不多,但是难度可能会高一些,如果你真的搞懂了这些问题,在绝大多数情况下会有举一反三的…

我们用vue，是因为它是当前业界最佳的解决方案之一，但前端技术方案迭代及工业标准化发展的浪潮，大概率不会在vue这里到达终点。 jquery没有死，它的基因已经注入浏览器标准。而webcomponent shadow dom的灵感，同样有受到vue和react的vdom技术的启…

本篇文章主要介绍 Vue 实现数据劫持的思路，下一篇则会介绍发布订阅模式的设计。 对于 Object 类型，主要劫持其属性的读取与设置操作。在 JavaScript 中对象的属性主要由一个字符串类型的“名称”以及一个“属性描述符”组成，属性描述符包括以下选项： enumerab…

当回答面试官问及的Vue问题，我们除了照本宣科的回答外，其实还可以根据少量的源码来秀一把，来体现出你对Vue的深度了解。 “谈谈你对Vue生命周期的理解。” 1. “new Vue()做了什么？” new关键字代表实例化一个对象, 而Vue实际上是一个类, 源码位置是/src/…

我们都知道 Vue 对于响应式属性的更新，只会精确更新依赖收集的当前组件，而不会递归的去更新子组件，这也是它性能强大的原因之一。 我们在触发 this.msg = 'Hello, Changed~'的时候，会触发组件的更新，视图的重新渲染。 但是 <ChildComponent…

目前社区有很多 Vue.js 的源码解析文章，很多大牛写的都非常详细，但说到底。光看文章自己不去研究源码和总结笔记，终究不会深入了解和记忆。 本篇文章将自己研究 Vue.js源码的一些内容做成笔记并且记录下来。加深印象和理解，俗话说读书百遍不如手写一遍。 MVC模式是指用户操作…