Vue生命周期指的是Vue实例或Vue组件实例在创建时经历的一系列初始化步骤。 在这个过程中Vue为用户提供了一些可供用户自定义的函数，即生命周期回调函数。这些函数又称为生命周期函数或生命周期钩子。 生命周期图示 Vue组件的生命周期图示如下： 下图是尚硅谷天禹所给的有关Vue生命周期的解释： 生命周期函数 生命周期函数本质是Vue在生命周期过程中的某些关键时刻帮用户调用的一些特殊名称的函数。 生命周期函数的名字不可更改，但函数的具体内容由程序员根据需求编写。 生命周期函数中的this指向的是当前的Vue实例或当前组件的实例对象。 下方代码演示了Vue生命周期函数： 1<div id="app"> 2 <!-- <h2...

数据代理是指通过一个对象代理另一个对象中属性的（读/写）操作。 数据代理的原理 数据代理可以通过Object.defineProperty()实现。在Vue中，很多技术的实现都使用到了Object.defineProperty()这个方法。 Object.defineProperty()的用法如下所示： 1let person = { 2 name: '张三', 3 sex: '男', 4 // age: 18, 5} 6 7/** 8 * 使用 Object.defineProperty() 给对象添加属性 9 * 1. 参数1：要添加属性的对象 10 * 2. 参数2：要给对象添加的属性名称 11 * 3. 参数3：要添加的属性...

文本插值 数据绑定最常见的形式就是文本插值。 在HTML标签体中，使用两个花括号{{ }}将JS表达式引起来。文本插值含义是将JS表达式的结果作为文本显示到页面中；并不是指JS表达式的结果为文本。 插值表达式的语法如下： 1{{expression}} 其中，expression将作为JS表达式去解析并执行。示例如下： 1<div id="app"> 2 <h1>Hello, {{name}}<!-- 插值表达式 -->!</h1> 3</div> 4 5<script type="text/javascript"> 6 new Vue({ 7 el: '#app', 8 data: { 9 name: 'Vue.js' 10 }...

Vue.js 使用了基于 HTML 的模板语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。结合响应系统，在应用状态改变时， Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。 Vue中模板语法有以下两种类型： 插值语法：用{{}}包裹起来的表达式。 Vue插值语法中，可以指定JS表达式将数据与模板进行绑定。 与语句不同的是，插值表达式指可以生成值的语句，这个语句可以放在任何需要值的地方。也就是说插值表达式一定需要有值（或返回值）。表达式中的变量、方法都是在对应Vue实例的 data 中定义的。当data发生了改变，页面中对应的数据也会发生改变（动态）。 指令语法：以v-为开头的Vue指令。

指令是指在Vue模板中由Vue原型对象或用户自定义的、带有v-前缀的特殊HTML属性。指令可以用于解析标签（包括标签属性、标签内容、绑定事件等等）。 数据绑定 单向数据绑定 v-bind单向数据绑定：单向绑定是指数据只能从Vue实例中的data流向页面内容。 将v-bind:置于要使用表达式的HTML属性前，Vue会将其属性值解析为表达式。v-bind的语法规则如下： 1v-bind:attribute="expression" attribute：v-bind指令的参数，v-bind指令的参数是HTML属性。 expression：表达式中的对象和方法等均来自Vue实例。 例如： 1<div id="app"> 2 <a...