样式绑定

实例

<div id="app1" v-bind:class="{class1: isOK, class2: class2IsOK}" v-on:mouseover="app1MouseOver" v-on:mouseleave="app1MouseLeave"></div>

.class1{
    width: 200px;
    height: 200px;
    background: grey;
}

.class2{
    border-radius: 100px;
}

var app1 = new Vue({
    el: "#app1",
    data: {
        isOK: true,
        class2IsOK: false
    },
    methods: {
        app1MouseOver: function(){
            this.class2IsOK = true;
        },
        app1MouseLeave: function(){
            this.class2IsOK = false;
        }
    }
});