class和style绑定

属性绑定添加字符串类名
html
```
   <div :class="className"></div>
```
类名绑定时会在原有的基础上进行添加
html
```
   <div :class="className" class="item"></div>
```

数组形式添加类名

html

   <div :class="classList"></div>

   classList: ['a', 'b', 'c', 'd'],

对象形式添加类名可以使用布尔值决定类名是否应该被添加

html

   <div :class="classObj"></div>

   classObj: {
           a: true,
           b: false,
           c: true
         },

样式添加对象形式在原有的基础上进行添加

html

   <div :style="styleObj" style="border: 10px solid black"></div>

   styleObj: {
      // 属性式样式属性的名称 值式样式属性的值
      backgroundColor: 'red',
      width: '100px',
      height: '100px'
   },

样式添加数组形式

html

   <div :style="styleList"></div>

   styleList: [
      // 数组嵌套对象
      {
         backgroundColor: 'blue'
      },
      {
         width: '200px'
      },
      {
         height: '200px'
      }
   ]

class和style绑定 ​

class和style绑定