Vue of class and style binding way

1. class

　　Object:

　　　　

1.<div :class="{active:isPlaying}"></div>

　<div: class = "{Active: isPlaying, Demo: isPlaying}"> </ div> 
  Active whether div element acting on the data determined by isPlaying, action is true, without effect to false.

2.

<div :class="obj"></div>
data:{
　　obj:{
　　　　active:true,
　　　　demo:false,
　　}
}

　　Array:

　　

<div :class="[demo,active]"></div>
data:{
  demo:demo,
  active:"temp-active"  
}
<div v-bind:class="[isActive ? activeClass : '', errorClass]"></div>
<div v-bind:class="[{ active: isActive }, errorClass]"></div>

 

2. Binding style

　Arrays and objects, substantially identical class　

<div :style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>