Vue中class与style

 <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"},
            ]
        },

 

posted @ 2021-04-15 20:21  lude1994  阅读(54)  评论(0编辑  收藏  举报