解决 el-ui 树形下拉列表不刷新的问题

解决 el-ui 树形下拉列表不刷新的问题

解决 删除修改后 下拉列表不刷新的情况

直接附上这段代码

加入map 回调函数 后面都附有注释的！！！！

html

<!-- 数据区域 -->
    <el-table
      :data="dataList"
      v-loading="loading"
      ref="table"
      border
      highlight-current-row
      @sort-change="sortChange"
      row-key="orderNo"
      lazy
      :load="loadChild"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      @current-change="selectRow"
      :class="showSearch?'showTable':'hideTable'"
    >

        

在data 中加入 map

data() {
    return {
      maps: new Map(),
}

写方法

 loadChild(tree, treeNode, resolve) {
      // 将当前选中节点数据存储到map中
      this.tre = tree.orderNo
      this.maps.set(tree.orderNo, { tree, treeNode, resolve })
      try {
        // 根据实际项目发送ajax获取数据
        getChildList({
          ParentOrder: tree.orderNo
        }).then(res => {
          const nodes = res.data.map(item => {
            return {
              ...item,
              // 该数据有三级结构
              hasChildren: item.level <= 2
            }
          })
          resolve(nodes)
        })
      } catch (error) {
        return error
      }
    } ,
// 重新触发树形表格的loadTree函数(因项目中需要多次触发loadTree方法，故封装成一个方法)
refreshLoadTree(ParentOrder) {
    // 根据父级id取出对应节点数据
    const { tree, treeNode, resolve } = this.maps.get(ParentOrder)
    this.$set(this.$refs.table.store.states.lazyTreeNodeMap, ParentOrder, [])
    if (tree) {
        this.loadChild(tree, treeNode, resolve)
    }
},

最后在提交按钮里 重置上面的方法

 /** 提交按钮 */
    submitForm: function () {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          if (this.form.orderNo != undefined && this.opertype === 2) {
            updateBWorkOrder(this.form)
              .then((res) => {
                this.msgSuccess('修改成功')
                this.open = false
                this.getList()
                this.refreshLoadTree(this.tre)

              })
              .catch((err) => {
                //TODO 错误逻辑
              })
          } else {
            console.log(this.form)
            addBWorkOrder(this.form)
              .then((res) => {
                this.msgSuccess('新增成功')
                this.open = false
                this.getList()
                this.refreshLoadTree(this.tre)
              })
              .catch((err) => {
                //TODO 错误逻辑
              })
          }
        }
      })
    },

最后 就完成啦 如果可以帮到你 他的价值就有了！