作者：小破孩子520 | 来源：互联网 | 2023-10-12 16:20
本文由编程笔记#小编为大家整理，主要介绍了class和style属性相关的知识，希望对你有一定的参考价值。
值类型：
1、表达式计算出的字符串结果或者字符串。
2、对象（表达式或者对象名，建议采用对象名）
key为className，值的真假控制这个name的有无。
//class
<div v-bind:class="classObject">div>
data: {
classObject: {//或者在计算属性里，在切换class里比较常用
active: true,
‘text-danger‘: false
}
}
//style
<div v-bind:style="styleObject">div>
data: {
styleObject: {
color: ‘red‘,
fontSize: ‘13px‘
}
}
3、数组
一般使用对象，数组不好处理计算。
4、指令class与普通class属性共存
<div
class="static"
v-bind:class="{ active: isActive, ‘text-danger‘: hasError }"
>div>
data: {
isActive: true,
hasError: false
}
//渲染结果
<div class="static active">div>
京公网安备 11010802041100号