vue 三元表达式动态绑定class

vue使用三元表达式绑定class

<div :class="[isActive ? 'active' :'']">测试</div>
<div class="active">测试</div> <!-- 等于上面 -->
<div :class="[isActive ? 'active' : '','normol']">测试1</div>
<div class="active normol">测试1</div> <!-- 等于上面 -->
<script>
export default {
    
    
	data () {
    
    
		return {
    
    
			isActive: true
		}
	}
}
</script>
<style scoped>
.active {
    
    
	font-size: 16px;
}
.normol {
    
    
	color: #000;
}
</style>

猜你喜欢

转载自blog.csdn.net/weixin_43908123/article/details/108491644