温馨提示：本文共580个字，读完预计2分钟。

一、vue模板语法

1. 插值表达式: {{}}

2. v-text =“name”：name就不再是字符串了，而是一个js的表达式

   就是innerHTML，显示name变量所对应的值，可以将数据变量显示在页面上，实际和插值表达式{{}}是一样的

3. v-html = “name”: 让innerHTML和name做一个数据绑定

4. 区别：v-text 会转义输出，不会有任何样式改变（插值表达式也是）

             v-html 不会进行转义，输出带样式效果

5. v-指令后面的内容为js表达式，除了写js表达式还可以在后面加上字符串（整体也是一个js表达式）

   例如：<div v-html ="name + ' Lee '"></div>

   插值表达式也一样，例如：{{name + ‘ Lee ’}}

二、计算属性，方法，监听

computed： 计算属性，有缓存。如果其依赖的数据项没有发生改变就不会重新计算，否则如果其依赖的数据项发生了改变就会触发里面的方法，与其无关的数据变化不会触发计算属性。

methods：方法， 没有缓存，使用时要加上()实现方法的调用，只要数据发生变化就会触发，不管数据就没有关系。（因为是函数的调用，又没有缓存，每调用一次就重新执行一次）

watch：监听器，有缓存。功能与computed相似，但是代码复杂。

如果同一个功能，上述三个都可以实现，那么推荐computed，结构简单，性能好。