vue模板语法两大类（插值语法和指令语法）和指令语法的基本使用

一、插值语法

1.功能：可以将data中的数据显示到模板上

2.语法：{ { xxx }}  

（1）里面可以写data中的数据字段名称

（2）可以写JS表达式

（3）不能写js语句：声明变量，分支，循环  ；访问在vue实例中的data之外定义的自定义的变量

二、指令语法

1.v-bind : 单向数据绑定

（1）特点：数据只能从 data 流向页面

（2）语法：  v-bind:href="xxx" 或简写 :href="xxx"  

（3）xxx的内容写法和插值语法一致

2.v-model : 双向数据绑定

（1）特点：数据不仅能从 data 流向页面，还能从页面流向 data

（2）双向绑定用于表单类元素身上（input、select）

（3）语法：v-model:value 或简写 v-model  ,因为默认收集va