element Tree 组件 全部禁用

官网自带的禁用状态: 可将 Tree 的某些节点设置为禁用状态

通过disabled :true设置。 可将 Tree 的某些节点设置为禁用状态
如下:

<script>
  export default {
    data() {
      return {
        data: [{
          id: 1,
          label: '一级 2',
          children: [{
            id: 3,
            label: '二级 2-1',
            children: [{
              id: 4,
              label: '三级 3-1-1'
            }, {
              id: 5,
              label: '三级 3-1-2',
              disabled: true
            }]
          }, {
            id: 2,
            label: '二级 2-2',
            disabled: true,
            children: [{
              id: 6,
              label: '三级 3-2-1'
            }, {
              id: 7,
              label: '三级 3-2-2',
              disabled: true
            }]
          }]
        }],
        defaultProps: {
          children: 'children',
          label: 'label'
        }
      };
    }
  };
</script>

但是有的需求前端用起来并不是太好用!

但是呢props绑定的对象中可以实现灵活禁用!

 <el-tree :data="list" show-checkbox node-key="id" :props="defaultProps" ref="tree" @check='addterrFn'>
  </el-tree>
defaultProps: {
          children: 'Child',
          label: 'Name',
          disabled: this.isdisabledFn,
        },
isdisabledFn() {
      return true
    },

版权声明:本文为xiaomage_ya原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。