vue动态控制CSS样式

Question

各位大佬好 想实现这样的需求 当我每次点击按钮添加一个组件时 组件就会缩进15px左右 请问这个如何实现呢？

Answer 1

两种方式：

1.

   <div :style = "margin: length+'px' "></div>   

js:

   

data(){

    return {

        length: 1,

    }

}

2.设置不同的class

    <div :class="{'youClass': isShow}"></div>   

    

js:

   

data(){

    return {

        isShow: true ,

    }

}

Answer 2

:style=“'margin：'xxx” 动态修改xxx