<div
:style="{color:colorSX, fontSize:sizeSX, background: isRed ? '#FF0000' : ''}">
hi vue
</div>
从以上代码,我们可知,
1.动态绑定style 前面有v-bind:
2.color 和 fontSize等,都可以直接书写 。 colorSX 和 sizeSX , 是data中的属性值, 如下所示
3.background,为三元运算,如果isRed为true ,则展示红色,否则无色。
data : {
colorSX : "#FFFFFF",
sizeSX : '50px',
isRed : true
}
图片效果为