模板渲染
Paste_Image.png
vue2.0种，必须使用
v-bind将变量渲染到属性中，
列表渲染
v-for
Paste_Image.png
也可以使用
v-text方法
Paste_Image.png
加序号index，2.0需要先声明index，例如：为奇数项添加odd类
Paste_Image.png
V-for进行对象渲染
Paste_Image.png
Paste_Image.png
引入组件：import后再注册 ，最后以标签的形式使用
Paste_Image.png
es6的简写，
Paste_Image.png
等同于
之前的版本
之前的版本
v-for渲染组件，意义：动态为组件传值（比如key）
定义一个方法，实现列表的更新
Paste_Image.png
Paste_Image.png
以下方法会触发列表的更新
改变数组的长度，直接为数组中的某一项赋值，不会触发列表的更新
Paste_Image.png
将数组第二项改为pinnaple，点击按钮，仍然不更新
需要使用vue提供的全局set方法
首先要导入Vue
Paste_Image.png
总结
Paste_Image.png
v-bind动态绑定，同步更新，比如link，class属性的绑定
当class是一个对象时，值为true的class会展现出来
Paste_Image.png
Paste_Image.png
当class是数组时，
也可以直接输入
Paste_Image.png
混用，数组和对象
Paste_Image.png
Paste_Image.png
绑定style
Paste_Image.png
条件渲染
v-if，v-show
Paste_Image.png
Paste_Image.png
按钮取反
按钮
区别：
v-show使用的是display:none;v-if`是从DOM中被删除
Paste_Image.png
v-else配合v-if使用
总结
n
