2vue的class动态绑定形式

vue的class动态绑定，分为2种形式

第一数组形式：

<div
class="test"
:class="[isGreen ? 'active' :'']">
我是模拟1
</div>

data中变量在前面展示

 

第二对象形式

<div
:class="{active:isActive,green:isTest}">
我是模拟2
</div>

data中变量写后面

 

<style>
.test{font-size:30px;}
.green{color:#00FF00;}
.active{background:#FFf000;}
</style>

 

动态绑定class ，由data中变量控制

data : {
isActive : true,
isGreen : true,
isTest: true,
}