elementui select多级下拉框

1. 模板

        <el-form-item label="上级分类" prop="itemId">
          <el-cascader
            :options="parentData"
            :show-all-levels="true"
            :props="{ checkStrictly: true, value: 'id' }"
            style="width: 420px"
            @change="selectParentData"
            :value="selItemId"
          ></el-cascader>
        </el-form-item>

2. 表单重置

      this.selItemId = this.parentData[0].id;
      this.form.itemId = this.parentData[0].id;//没有change的触发时候赋值

3. 多选框选中

    selectParentData(data) {

      let index = data.length;

      for (const key in data) {

        if (key == index - 1) {

          this.form.categoryId = data[key];

        }

      }

    },

4. 取数据

    getParentData() {
      subjectCheckingCategoryMenuTree().then((response) => {
        response.SubjectCheckingCategoryMenus.unshift({
          id: "0",
          label: "根目录",
        });
        this.parentData = response.SubjectCheckingCategoryMenus;
      });
    },

 

5. 回显

this.selParentId = response.data.parentId;

  response.data.parentId = String(response.data.parentId);

this.form = response.data;

 

6. 注意注意注意：一定要用v-model，而不用value绑定数据，不然就会出现默认选项不能再次选择的问题