解决el-table懒加载数据刷新问题
ElementUI el-table树形数据,数据懒加载刷新问题
·
解决二级数据修改删除刷新操作,数据不更新问题
step1:在data中设置属性
data(){
return{
treeNodeMap: new Map(),
pid:'',// 父节点id
}
}
step2:调用懒加载属性时,在map中set当前节点数据
load(tree, treeNode, resolve) {
this.pid = tree.id;
// 加载子节点时,对子节点进行赋值
this.treeNodeMap.set(tree.id, {tree, treeNode, resolve});
let _this = this;
// 获取子节点数据
_this.$ajax.post("/api/sfxmtb/getBySfxmbh", _this.$qs.stringify({id: tree.id})).then((res) => {
let {data, code} = res.data;
if (code == '200') {
console.log(data);
// 返回子节点数据
resolve(data);
} else {
_this.$message.error(_this.$t('resultCodeInfo.' + res.data.code));
}
});
},
step3:操作二级数据之后,请求接口,进行刷新
editSrly() {
let _this = this;
_this.$ajax.post("/api/sfxmtb/editSrly", _this.sfxmtbForm).then((res) => {
let {data, code} = res.data;
if (code == '200') {
_this.$message.success("保存成功");
// 关闭模态框
this.handleClose();
// 刷新懒加载数据
this.refreshData();
} else {
_this.$message.error(_this.$t('resultCodeInfo.' + res.data.code));
}
})
},
refreshData() {
// 获取节点
const node = this.treeNodeMap.get(this.pid);
// 获取需要刷新节点
const {tree, treeNode, resolve} = node
// 重新加载子节点数据
this.load(tree, treeNode, resolve);
},
更多推荐
已为社区贡献1条内容
所有评论(0)