vue08我是怎么学的：v-bind动态绑定类（对象语法）
在实际开发中，一个标签的类通常不会用一个普通的字符串写死，而是将类动态绑定到标签上，有2种绑定语法：对象语法和数组语法。绑定的对象语法（常见）方式是使用对象v-bind:class="{}"。对象{}由键值对组成，其中键是类名，值是布尔值。如下图：对象语法的核心是：根据布尔值，判断是否添加某个类到标签。重点是Boolean不仅可以通过数据来定义，还可以通过计算得到（比如用===来计算true或false）。使用场景：有的时候需要在标签中添加类，有的时候不需要添加。比如在豆瓣电影页面，【最热门电影】右侧有几个按钮，点击那个按钮颜色会变成黑色，其他按钮上的字会变成灰色。通过查看控制台，我们可以看到当按钮被点击时，在标签中添加了一个active类，其他按钮的active类被移除。演示1：动态绑定classdom到标签{{message}}data:{message:"Hello",isActive:true,isLine:true}以便显示h2的两个类。Demo2：点击按钮h2变为红色，再点击h2变为黑色dom{{message}}button
vue实例constapp=newVue({el:'#app',data:{message:'Hello',isActive:true,isLine:true},methods:{btnClick:function(){this.isActive=!this.isActive}}})练习使用v-for加v-bind实现如下效果：点击哪个项目，哪个项目变为红色。重要提示：每个里都有一个索引。判断li是否等于预设值来判断动态绑定的class是true还是false。缩写使用：class代替v-bind:class
如果对象太长，可以把对象绑定成方法，或者用computed来计算属性。methods上面的缩写，如果我觉得{active:isActive,line:isLine}太长，我可以把这个对象写成一个方法，然后把这个方法放到vue实例的methods属性中。{{message}}按钮computed后面会讲到。固定类推荐使用class=""，后面可能会删除，使用v-bind:class="{}"。class=""和v-bind:class="{}"可以写在一起，不会冲突。数组语法（不常用）当类较多时，可以将类名放入数组中显示。{{message}}您还可以将[active,line]放入方法中。{{message}}constapp=newVue({el:'#app',data:{message:'你好啊',活动：'aaaaaa'，行：'bbbbbbb'}，方法：{getClasses：函数（）{返回[this.active，this.line]}}}）
