动态绑定class

绑定class几种方式 

        1、使用数组方式进行，根据data中定义的id进行动态绑定，boxSize为为固定的class名

<div :class="['boxSize',actived:id==1]"></div>
<div :class="['boxSize',actived:id==2]"></div>

        2、使用对象方式进行，根据data中定义的id进行动态绑定

<div :class="{'boxSize':true,actived:id==1}"></div>
<div :class="{'boxSize':true,actived:id==2}"></div>

        3、绑定一个计算属性，动态计算出 class 名称, 也可以computed通过传参判定

<div :class="actived(row)"></div>

computed: {
  actived() {
      return row => {
        return row.id== this.id?'actived':''
      };
   },

   taskIcon() {
      return row => {
        if (!row.parenttaskno || (row.children && row.children.length)) {
          return 'if-folder';
        } else {
          return 'if-file-text-o';
        }
      };
   },
}

• 使用场景

 tab切换显示、高亮显示