web前端框架vue样式绑定之class绑定对象和数组

样式部分：

逻辑部分：

      

      测试样式
      
      切换
    
    
    

核心思路：通过v-bind:class绑定active和error两个样式的类名，通过true和false控制样式的显示和隐藏，this.isActive = !this.isActive的意思是直接取反。

同理，数组的绑定方式如下，样式代码相同，逻辑代码如下：

      
测试样式
      切换
    
    
    

核心思路：数组使用v-bind:class绑定数组，在方法中控制样式是直接控制activeClass的数值。对象方法和数组方法可以结合起来使用。