vue学习笔记12-20

mustache语法用于从data中取出变量对应数据，进行标签内容的显示
v-bind用于将变量对应数据进行属性的赋值：
v-bind语法糖： :（冒号）
例子： <a v-bind:href="ahref"></a>相当于<a :href="ahref"></a>
注：class的绑定同理

v-bind动态绑定class属性：
class在使用v-bind时，多在class内容中加上一个对象，对象内为 类型名：布尔值（也就是当布尔值为1时，包含这个类名，否则不包含）
例子：<a v-bind:class="{active: isActive}"></a>
特别注意：这是一个大括号代表一个对象，而不是mustache语法
在什么时候会使用这种v-bind:class的语法：其中的类名会发生改变，不改变的话直接使用原本的形式（不加v-bind:的class=“类名”）即可。
v-bind动态绑定style属性
style在使用v-bind动态绑定时，在style中添加一个对象，内容为CSS属性名：CSS属性值
例子：<h2 v-bind:style="{color: 'red'}"></h2>

之前涉及到的v-on和v-for知识点
v-on：对事件进行监听（监听动作，后面可能加上click或其他的动作事件）
语法糖：@ (圈a)<button v-on:click="btnClick">按钮</button>与<button @click="btnClick">按钮</button>
例子：<button v-on:click="btnClick">按钮</button>点击按钮就会执行methods中的btnClick函数
注：这里调用methods中的函数是需要加上小括号的，也就是:click=“btnClick()”，这里没有加是被省略掉了。调用的所有函数最好都加上小括号，防止混淆不清。

v-for语法：
多使用在li标签中，也就是那个标签需要遍历，就加在那个标签上。
例子：<ul> <li v-for="m in movies">{{m}}</li> </ul>