el-tree点击时改变字体颜色+根据返回数据改变字体颜色

1.点击时字体为蓝色，state=1

过滤返回数据：state=0为灰色，state=1颜色正常

2.html 

       <el-tree ref="tree" class="filter-tree check" :class="isCheck=='1'?'start':''" :data="data" default-expand-all
          node-key="id" :filter-node-method="filterNode" :props="defaultProps" @node-click="handleNodeClick">
          <span class="custom-tree-node"
            :class="data.state == 1 ? 'selling-category' : (data.state == 0 ? 'seckill-category' : 'common-category')"
            slot-scope="{data}">
            <span>
              {{data.code}}{{ data.label}}
            </span>
          </span>
        </el-tree>

3.js

  handleNodeClick(data) {
        console.log('它本身', data)
        this.isCheck = data.state
        console.log(this.isCheck)

      },

 

4.css 

     $stop: #ccc;
      $start: #409EFF;
      $default: #606266;

      .start .el-tree-node:focus>.el-tree-node__content {
        color: $start !important;
        background-color: #fff; //节点的背景颜色//节点的字体颜色
      }

      .custom-tree-node .selling-category {
        color: $default;
      }

      .seckill-category {
        color: $stop;
      }

      .common-category {
        color: $default;
      }