Vue基礎之Class和Style繫結
既然v-bind可以動態繫結標籤的屬性，那麼也可以用v-bind來處理class和style，只需要計算出表示式最終的字串。不過，字串拼接麻煩又易錯。因此，在 v-bind 用於 class 和 style 時， Vue.js 專門增強了它。表示式的結果型別除了字串之外，還可以是物件或陣列
繫結 HTML Class：
物件語法：
我們可以傳給 v-bind:class 一個物件，以動態地切換 class ，物件的屬性名就是要給標籤新增的類名，而決定類是否要顯示的則是鍵值的真假，這裡鍵值既可以是表示式也可以是data中的資料
上面的語法表示 classactive 的更新將取決於資料屬性 isActive 是否為真值
這裡如果動態計算函式currentInde的返回結果等於index的值，就會顯示出類current
我們也可以在物件中傳入更多屬性用來動態切換多個 class 。此外， v-bind:class 指令可以與普通的 class 屬性共存
如下 data:
渲染為:
你也可以直接繫結資料裡的一個物件：
陣列語法：
我們可以把一個數組傳給 v-bind:class ，以應用一個 class 列表，陣列的值並不是要新增到標籤中的，而是其在data中對應的值才是真正要新增到DOM中的
渲染為:
如果你也想根據條件切換列表中的 class ，可以用三元表示式：
此例始終新增 errorClass ，但是隻有在 isActive 是 true 時新增 activeClass
不過，當有多個條件 class 時這樣寫有些繁瑣。可以在陣列語法中使用物件語法
用在元件上：
當你在一個定製的元件上用到 class 屬性的時候，這些類將被新增到根元素上面，這個元素上已經存在的類不會被覆蓋
宣告元件的一種方式是通過”Vue.component()”
例如，如果你聲明瞭這個元件:
然後在使用它的時候新增一些類
HTML 最終將被渲染成為
同樣的適用於繫結 HTML class
當 isActive 為 true 的時候，HTML 將被渲染成為
繫結內聯樣式：
物件語法：
v-bind:style 的物件語法十分直觀——看著非常像 CSS ，其實它是一個 JavaScript 物件。 CSS 屬性名可以用駝峰式（camelCase）或短橫分隔命名（kebab-case）
直接繫結到一個樣式物件通常更好，讓模板更清晰
陣列語法：
v-bind:style 的陣列語法可以將多個樣式物件應用到一個元素上
