el-tree多级选择设置disabled不生效

Question

el-tree多级选择设置disabled不生效

给不能选择的选择项设置disabled为true,但是还是可以正常选择，应该怎么修改

代码

<template>
  <div class="about">
    <el-button type="primary" @click="handleOpen">打开Dialog</el-button>
    <el-dialog :visible.sync="open" title="title">
      <el-form :model="form" ref="form" :inline="true">
        <el-form-item label="类型" prop="type">
          <el-tree 
            :data="typeList" 
            node-key="id"
            :props="defaultProps" 
            @node-click="handleNodeClick"
        ></el-tree>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button size="mini" type="primary" @click="submit">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form:{},
      open:false,
      defaultProps: {
        children: 'children',
        label: 'name',
        value: 'id'
      },
      typeList: [],
    };
  },
  created() {
    this.getList()
  },
  methods: {
    getList(){
      const data = [
          {
              id:2,
              parentId:null,
              sort:1,
              name: "type1",
              flag:1,
              code:'020000',
              children:[
                  {
                      id:14,
                      parentId:2,
                      sort:1,
                      name: "type2",
                      flag:1,
                      code:'020101',
                      children:[
                        {
                            id:15,
                            parentId:2,
                            sort:1,
                            name: "type2-1",
                            disabled: true,
                            flag:1,
                            code:'020102',
                        },
                        {
                            id:16,
                            parentId:2,
                            sort:1,
                            name: "type2-2",
                            disabled: true,
                            flag:1,
                            code:'020103',
                        }
                      ]
                  },
                  
              ]
          },
      ]
      this.typeList = data
      console.log(this.typeList,'typelist')
    },
    handleNodeClick(data) {
      this.form.type = data.id
      console.log(data);
    },
    handleOpen(){
      this.open = true
    },
    submit(){
      console.log(this.form,'form')
    },
  },
};
</script>

Answer 1

如果您希望在Vue.js中输出中文，您可以直接在Vue组件的数据中包含中文字符串。在您提供的代码中，您已经在typeList数据中包含了中文。
例如，name属性中的字符串是中文的：