-最简单的绑定(这里的active加不加单引号都可以,以下也一样都能渲染)
:class="{ 'active': isactive }"
:class="{'active':isactive==-1}" 或者 :class="{'active':isactive==index}"
第一种(用逗号隔开)
:class="{ 'active': isactive, 'sort': issort }"
第二种(放在data里面)
//也可以把后面绑定的对象写在一个变量放在data里面,可以变成下面这样 :class="classobject" data() { return { classobject:{ active: true, sort:false } } }
第三种(使用computed属性)
:class="classobject" data() { return { isactive: true, issort: false } }, computed: { classobject: function () { return { active: this.isactive, sort:this.issort } } }
:class="[isactive,issort]" data() { return{ isactive:'active', issort:'sort' } }
:class="[isactive?'active':'']" 或者 :class="[isactive==1?'active':'']" 或者 :class="[isactive==index?'active':'']" 或者 :class="[isactive==index?'active':'otheractiveclass']"
//前面这个active在对象里面可以不加单引号,后面这个sort要加单引号 :class="[{ active: isactive }, 'sort']" 或者 :class="[{ active: isactive==1 }, 'sort']" 或者 :class="[{ active: isactive==index }, 'sort']"
如对本文有疑问, 点击进行留言回复!!
网友评论