Vue基础语法

Vue模板语法有2大类：

1.插值语法：

• 功能：用于解析标签体内容。
• 写法：{{XXX}}，XXX是Js表达式，且可以直接读取到date中的所有属性。

2.指令语法：

• 功能：用于解析标签（包括：标签属性、标签内容、绑定事件…）。
• 举例：v-bind:href=“XXX” 或简写为：href=“XXX”,XXX同样要写js表达式，且可以直接读取到date中的所有属性。
• 备注：Vue中有很多的指令，且形式都是：v-???,此处我们只是拿v-bind举个例子。

Vue中有2种数据绑定的方式：

1.单向绑定（v-bind）:数据只能从date流向页面。
2.双向绑定（v-bind）:数据不仅能从date流向页面，还可以从页面流向date.

备注：1.双向绑定一般都应用在表单类元素上（如：input、select等）
2.v-model:value 可以简写为v-model,因为v-model默认收集的就是value值。

//准备好一个容器
<div id = "root">
单向数据绑定：<input type="text" v-bind:value = "name"><br/>
双向数据绑定：<input type="text" v-model:value = "name"><br/>