白马笑西风

在对Vue项目进行性能优化时，除了借助外部工具之外，还可以利用框架自身的性能埋点来加以分析。在分析具体Vue中性能埋点代码之前，先对监控前端性能的一些API进行简单阐述。 Performance 接口可以获取到当前页面中与性能相关的信息，可以通过 window.performa…

在 Vue 中，除函数式组件外，所有组件都是 Vue 实例。每个 Vue 实例在被创建时都要经过一系列的初始化过程：数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。 在生成 Vue 实例的过程中会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加…

Vue 事件分为两类：原生DOM事件、自定义事件。其中原生DOM事件既可以在元素上使用，也可以在组件上使用，在组件上使用时要添加.native修饰符。 Vue 通过调用原生API来处理元素和组件上绑定的原生DOM事件，在组件上的自定义事件则是由基于发布/订阅模式的事件中心机制完…

指令是带有 v- 前缀的特殊特性，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM。 Vue2.0 内置了形如v-bind、v-on等指令，如果需要对普通 DOM 元素进行底层操作还可以使用自定义指令。 在 Vue2.0 中，可以通过自定义指令对普通 DOM 元素…

Vue2.0中一共有五个内置组件：动态渲染组件的component、用于过渡动画的transition-group与transition、缓存组件的keep-alive、内容分发插槽的slot。 component组件配合is属性在编译的过程中被替换成具体的组件，而slot组件…

Vue 实现了一套内容分发的 API，将 <slot> 元素作为承载分发内容的出口。<slot> 在子组件中可以有多个，使用 name 属性实现具名插槽。 从插槽内容能否使用子组件数据的角度可将插槽分为两类：普通插槽、作用域插槽。 普通插槽不能使用子组件的数据，父级模板里的所有…

传统的页面开发主张将内容、样式和行为分开，便于开发和维护。等到React、Vue等MVVM前端框架大行其道时，人们更倾向于使用html、css、js聚合在一起创建组件，通过编写小型、独立和通常可复用的组件来构建大型应用。 组件是现代开发框架的基石，下面详细介绍Vue组件的实现原…

Vue2.0 与 Vue1.0最大的区别就是使用了 Virtual DOM 。使用虚拟DOM的好处主要有两点： 在具体介绍虚拟DOM之前，先找到DOM挂载方法的位置与生成的过程。 Vue的DOM挂载是在一系列初始化之后进行的，初始化方法 _init 定义在 /src/core/…

在使用Vue进行实际开发的过程中，大多数时候使用模板来创建HTML，模板功能强大且简洁直观，最终模板会编译成渲染函数，本文主要介绍模板编译的具体过程。 Vue从能否处理 template 选项的角度分为两个版本：运行时+编译器、只包含运行时。运行时+编译器版本也被称为完整版。只…