Vue中的模板语法

一、基础语法

1.{{XXX}} 中的内容要写js表达式 且xxx可以自动读取到data中的所有属性

2.一旦data中的数据发生改变 那么页面中用到该数据的地方会自动更新

注意区分 js表达式 和 js代码（语句）

js表达式 ：一个表达式会产生一个值，可以放在任何一个需要值得地方

例如 a a+b demo(1) x === y ? 'a' : 'b'

js代码（语句）: if(){} for(){}

二、模板语法

1.插值语法

功能：用于解析标签体内容

写法：{{xxx}},xxx是js表达式 且可以直接读取到data中的所有属性。

2.指令语法

功能：用于解析标签（包括：标签属性、标签体内容、绑定事件。。。）

举例：v-bind:href="xxx" 或者简写为 :href="xxx" xxx同样是js表达式

且可以直接读取到data中的所有属性

备注 vue中有很多指令 且形式都是 v-???-

指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM。

三、重要的原则：

由vue管理的函数，一定不要写箭头函数，一旦写了箭头函数，this就不再是vue实例了