class和style绑定的高级用法

class绑定的高级用法

1. 数组绑定多个class

数组绑定多个class
.normal{
    color:green
}
.active{
    color:red
}

2. 数组包含对象绑定class

数组包含对象绑定class
 data(){
        return {
            isActive:true
        }
 },

3. 数组包含方法绑定对象

数组包含方法绑定class
    methods:{
        showWarning(){
            return 'warning'
        }
    }

style绑定的高级用法（class绑定的是类名，style绑定的是对象）

1. 数组绑定多个style

数组绑定多个style
    data(){
        return {
            warning:{
                color:'red'
            },
            bold:{
                fontWeight:'bold'
            }
        }
    },

2. 数组包含方法绑定style

数组包含方法绑定style
    data(){
        return {
            warning:{
                color:'red'
            },
            bold:{
                fontWeight:'bold'
            }
        }
    },
    methods:{
        mix(){
            return {
                ...this.bold,
                fontSize:20
            }
        }
    }

3. style多重值

style多重值