Vue學習筆記（4）關於class和style綁定

我們利用Vue中的v-bind指令可以很好進行數據綁定，當然對於class和style也是一樣的。

而且v-bind用來綁定class也同時可以和普通的class並存，靈活地運用v-bind來切換class或者style可以做到意想不到的效果。

而且你還可以將一個數組傳給v-bind：class，當然使用三元表達式也是沒有問題的。

當你想綁定style的時候如何綁定呢

<div v-bind:style="{color:TheColorYouWant}"></div>

如上即可實現綁定。

你也可以綁定到一個對象上

<div v-bind:style="yourStyle"></div>

然後在Vue實例裏面的data裏寫

new Vue({

      el:'#app',

      data:{

        yourStyle:{ color:'red' }  

     }

})

以上就是關於綁定class和style的基本內容，比較簡單。