elementui table子级tree懒加载bug

  1. 删除子级刷新列表子级依然显示

2.更新状态子级列表未刷新

3.编辑子级后刷新页面显示状态未变更

el-table 树表格load源码

首先,load可以执行,但是只剩一个子节点就有问题,那么就直接可以定位bug在load方法里:

文件路径:element-plus\packages\components\table\src\store\tree.ts

const loadData = (row: T, key: string, treeNode) => {

const { load } = instance.props as unknown as TableProps<T>

if (load && !treeData.value[key].loaded) {

treeData.value[key].loading = true

load(row, treeNode, (data) => {

if (!Array.isArray(data)) {

throw new TypeError('[ElTable] data must be an array')

}

treeData.value[key].loading = false

treeData.value[key].loaded = true

treeData.value[key].expanded = true

// 就是这里,我们的子节点删完了data.length == 0,无法赋值

if (data.length) {

lazyTreeNodeMap.value[key] = data

}

instance.emit('expand-change', row, true)

})

}

}

增加方法手动刷新子级数据

// 刷新时

const refreshChild = (parentId) => {

if (rowMaps.get(parentId)) {

const { tree, treeNode, resolve } = rowMaps.get(parentId);

handleLoadTableChild(tree, treeNode, resolve);

} else {

sysTemp.value.getTableData();

}

};

// 先new一个map用于数据保存

const rowMaps = reactive(new Map());

load加载时存储父级id及数据信息

rowMaps.set(tree.id, { tree, treeNode, resolve });

相关推荐
BBB努力学习程序设计36 分钟前
CSS Sprite技术:用“雪碧图”提升网站性能的魔法
前端·html
BBB努力学习程序设计42 分钟前
CSS3渐变:用代码描绘色彩的流动之美
前端·html
冰暮流星1 小时前
css之动画
前端·css
没有韭菜的饺子1 小时前
记录一个IDEA的神奇bug
bug
jump6801 小时前
axios
前端
spionbo1 小时前
前端解构赋值避坑指南基础到高阶深度解析技巧
前端
用户4099322502121 小时前
Vue响应式声明的API差异、底层原理与常见陷阱你都搞懂了吗
前端·ai编程·trae
开发者小天1 小时前
React中的componentWillUnmount 使用
前端·javascript·vue.js·react.js
永远的个初学者2 小时前
图片优化 上传图片压缩 npm包支持vue(react)框架开源插件 支持在线与本地
前端·vue.js·react.js
爱吃土豆的马铃薯ㅤㅤㅤㅤㅤㅤㅤㅤㅤ2 小时前
npm i / npm install 卡死不动解决方法
前端·npm·node.js