vue 动态 class

<div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"> 
	动态切换多个 class
</div>

data: {
	isActive:true,	
	hasError:false
}
=>
`<div class="static active">` 动态切换多个 class`</div>`


<div v-bind:class="classObject">通过对象形式渲染 class</div>
data: {
	classObject: {	
		active: true,
		'text-danger': false
	}
}
=>
<div class="active"> 动态切换多个 class</div>


<div v-bind:class="[activeClass, errorClass]"></div>
data: {
	activeClass: 'active',
	errorClass: 'text-danger'
}
=>
<div class="active text-danger"></div>

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

你可能感兴趣的:(小程序,小程序)