• 周四. 8月 11th, 2022

5G编程聚合网

5G时代下一个聚合的编程学习网

热门标签

vue 行间绑定样式的小技巧 :style=

admin

11月 28, 2021

vue 行间绑定样式的小技巧

最简单的


<div :style="{color:"#ff0000",'margin-top':marTop,backgroundColor:conBgColor,'font-size':isFont?'10px':'0px'}">哈哈哈</div>
marTop 和 conBgColor是变量哈
'font-size':isFont?'10px':'0px'也是三目的写法

三目运算符的


<div :style="marTop?'color:#333':'color:red'">哈哈哈</div>
<div :style="'font-size':sizePX+'px'">哈哈哈</div>

marTop 和sizePX是变量哈

组合版


<div :style="[marTop?'color:#333':'color:red',{color:"#ff0000"}]">哈哈哈</div>
marTop 是变量哈
这样就可以瞎玩了

发表评论

您的电子邮箱地址不会被公开。