我們已經(jīng)介紹了指令v-bind 的基本用法以及它的語法糖吉嚣，它的主要用法是動態(tài)更新html元素上的屬性；
1蹬铺、綁定class的幾種方式
<div :class=”{’ active ’: isActive }”></div>
對象中也可以傳入多個屬性瓦戚，來動態(tài)切換class 。另外丛塌，:class 可以與普通class 共存，如：
<div class="static": class="{'active': i sActive,'error':isError }"＞</div>
當:class 的表達式過長或邏輯復雜時畜疾，還可以綁定一個計算屬性赴邻，這是一種很友好和常見的用法，一般當條件多于兩個時啡捶，都可以使用data 或computed 姥敛，如：
<div : class= ” classes ” ></ div>
var app =new Vue({
el :’#app ’,
data : {
} ,
isActive : true ,
error : null
computed: {
classes : function () {
return {
active : this . isActive && !this.error,
’ text-fail ’: this.error && this.error.type === ’ fail ’
}
}
})
多個class時，也可以是數(shù)組瞎暑，<div :class ＝ "[activeCls , errorCls]" ></div>
三目運算：<div : class = ” [ isActive ? activeCls :”, errorCls ] ” ></ div>
class 有多個條件時彤敛，這樣寫較為煩瑣，可以在數(shù)組語法中使用對象語法：<div : class =” [{ ’ active ’: isActive } , errorCls ) ” ></ div>
2了赌、綁定內(nèi)聯(lián)樣式
使用v-bind:style （即： style ） 可以給元素綁定內(nèi)聯(lián)樣式墨榄，方法與： class 類似，也有對象語法和數(shù)組語法勿她，看起來很像直接在元素上寫CSS:
<div :style＝"{’ color ’: color, ’ fontSize ’ : fontSize ＋’ px ’}">文本</div>
大多數(shù)情況下袄秩， 直接寫一長串的樣式不便于閱讀和維護，所以一般寫在data 或computed 里;另外逢并， 使用： style 時之剧， Vue .js 會自動給特殊的css 屬性名稱增加前綴， 比如transform 砍聊。
