首页 > 其他 > 详细

Vue中class与style

时间:2021-04-15 23:42:14      阅读:26      评论:0      收藏:0      [点我收藏+]
 <div id="box">
        <div :class="classobj">动态切换class--对象写法</div>
        <div :class="classarr">动态切换class--数组写法</div>
        <div :style="styleobj">动态切换style--对象写法</div>
        <div :style="stylearr">动态切换style--数组写法</div>
    </div>

 

 

data: {
            classobj: { // 动态切换class--对象写法
                a: true,
                b: true,
                c: true,
            },
            classarr: [ // 动态切换class--数组写法
                "aa", "nn", "cc"
            ],
            styleobj: { // 动态切换style--对象写法
                backgroundColor: "red",

            },
            stylearr: [ // 动态切换style--数组写法, 如果需要push也是需要push进{}
                {backgroundColor: "red"},
                {fontSize: "23px"},
            ]
        },

 

Vue中class与style

原文:https://www.cnblogs.com/lude1994/p/14664280.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!