class和style屬性

值類型：

1、表達式計算出的字符串結果或者字符串。

2、對象（表達式或者對象名，建議采用對象名）

key為className，值的真假控制這個name的有無。

//class
<div v-bind:class="classObject"></div>
data: {
  classObject: {//或者在計算屬性里，在切換class里比較常用
    active: true,
    'text-danger': false
  }
}

//style
<div v-bind:style="styleObject"></div>
data: {
  styleObject: {
    color: 'red',
    fontSize: '13px'
  }
}

3、數組

一般使用對象，數組不好處理計算。

4、指令class與普通class屬性共存

<div
  class="static"
  v-bind:class="{ active: isActive, 'text-danger': hasError }"
></div>

data: {
  isActive: true,
  hasError: false
}
//渲染結果
<div class="static active"></div>