vue基础（3）—— v-bind及class与style绑定

绑定class的几种方式

对象语法

v-bind:class设置一个对象，动态切换class。当isActive为true时，div会拥有类名active，为false时没有class名渲染。

:class也可以与普通的class共存，也可传入多个属性。

    
//class="active"
    

    //class="static active"

当class表达式过长，可以使用computed计算属性。

    
大大方方的
    //class="active textf"

数组语法

需要应用多个class时，可以使用数组语法，定义一个class数组。

    



渲染结果:

可以在数组语法中使用对象语法。

绑定内联样式

对象语法

    
文本

css属性名称使用驼峰命名或者短横分隔命名，渲染后为

 写在data里维护,也可以写在computed里维护。

    
文本