【vue】样式绑定

对于样式大家是不是很熟悉呢？没有错就是css
在vue中class也是可以绑定的，是不是很神奇

一、class样式绑定

1、class对象绑定

<style>
    .activated{
    color:red;
    }
</style>
    
 <div id="app">
    <div @click="handleDivClick"
    :class="{activated:isActivated}">
    hello world
    </div>
 </div>
    
 <script>
    var vm=new Vue({
    el:"#app",
    data:{
    isActivated:false
    },
    methods:{
    handleDivClick:function(){
    this.isActivated=!this.isActivated;
    }
    }
    })
 </script>

解析：就是 :class=“对象”，这样就是对象绑定

2、class数组绑定

<style>
    .activated{
    color:red;
    }
</style>
    
<div id="app">
    <div @click="handleDivClick"
    :class="[activated]">
    hello world
    </div&g