. Vue基础语法

. Vue基础语法
1. Vue使用

• 1. 生成Vue实例和DOM中元素绑定
• 2. app.$el --> 取出该vue实例绑定的DOM标签
• 3. app.$data --> 取出该vue实例绑定的data属性

2. 模板语法

• 1. {{name}} --> 在标签中间引用data属性中的变量
• 2. v-html='msg' --> 在页面上显示我定义的标签元素
• 3. v-if='ok' --> 控制标签在不在DOM中
• 4. v-show='!ok' --> 控制标签的display属性的值（是否显示）
• 5. v-bind:href='url' --> 将标签的属性和vue实例的data属性绑定起来
• 6. v-on:click='dianwo'--> 给标签绑定一个点击事件，方法需要在vue实例的methods中定义
• 7. v-model='article' --> 用在input标签和textarea标签中，将用户输入和vue实例中的数据属性建立双向绑定

3. 计算属性和侦听器
1. 计算属性
（字符串翻转的例子）

• 1. 计算属性需要定义在vue实例的 computed 中
• 2. 多用于对变量做一些自定义的操作
• 3. 我们在页面上像使用普通data属性一样使用计算属性

2. 侦听器

• 多用于一些复杂的运算或者异步操作
• 侦听器需要放在 vue实例的 watch 中

4. class和style属性

• 1. 基于对象的绑定
• 2. 基于数组的绑定

5. 条件渲染

• v-if
• 如果想控制多个标签的显示与否，可以使用 template 标签把它们包起来
• v-if/v-else
• v-if/v-else if /v-else

6. 列表渲染

• v-for循环

7. 事件处理

• 详见2.模板语法

8. 表单绑定

• 详见2.模板语法