一种在vue环境下动态改变css样式class属性的方法

<div class="item" :class="changeStyle" @click="dododo()">
    onepiece
</div>

class="item" 是固定样式,:class="changeStyle" 是动态样式。
在css中,分别定义两个待变换样式的类。如:

.bg-red {
    background-color: red;
}

.bg-green {
    background-color: green;
}
dododo() {
    this.changeStyle = this.changeStyle ? 'bg-red' : 'bg-green'
}
版权声明

弈心博客


本文首发site_name,转载请附上博文链接!