动态绑定class,style

动态绑定class

1.对象
<myComponent :class= {active:isActive} />
isActive:是data变量,为true就添加active class
另外如果class比较多,直接将该对象放在data,然后动态绑定即可

2.数组
<myComponent :class= [a,b,c] />
a,b,c为data变量,添加的class为a,b,c的值

还可以这么用
<myComponent :class= [{active:isActive},a,b] />

动态绑定style

1.对象
<myConponent :style= {backgroundColor:bgc,font-size:fSize+”px”} />
bgc,fSize为data中变量

同样可以在data直接写该对象

2.数组
<myConponent :style= [obj1,obj2…] />
obj1,obj2是data中变量,例如:
data:{
obj1:{backgroundColor:red},
obj2:{border:1px black,solid}
}

© 版权声明
THE END
如果内容对您有所帮助,就支持一下吧!
点赞0 分享
Iris-yt的头像 - 宋马
评论 抢沙发

请登录后发表评论

    暂无评论内容