第一步：在element中得table加入
:load=“load”
<el-table
:key="tableKey"
v-loading="listLoading"
:data="list"
border
fit
highlight-current-row
style="width: 100%"
row-key="Id"
@selection-change="onSelectChange"
lazy
:load="load"
ref="table"
>
<el-table-column type="selection" width="55" />
<el-table-column
v-for="(item, index) in columns"
:key="index"
:prop="item.dataIndex"
:width="item.width"
:label="item.title"
/>
<el-table-column
label="操作"
align="center"
width="230"
class-name="small-padding fixed-width"
>
<template slot-scope="{ row }">
<el-button type="primary" @click="handleEdit(row.Id, row)"
>编辑</el-button
>
<el-button type="danger" @click="handleDelete([row.Id], row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
第二步：在load方法中存树形节点
/**
* 延迟加载
*/
load(tree, treeNode, resolve) {
const id = tree.Id;
this.loadNodeMap.set(id, { tree, treeNode, resolve });//存树形节点
GetTreeDataList({ parentId: tree.Id }).then((response) => {
response.Data.forEach((element) => {
element.hasChildren = true;
});
resolve(response.Data);
});
},
第三步：在树形节点数据更新时重新刷新节点
/**
* 在新增类型后根据selectCurrRow的id 获取loadNodeMap 中对应的
* resolve 进行子节点刷新操作
* 刷新table 列表
*@param callbackRow{Array} 执行新增后返回当前节点的子节点数组
*
*/
reRenderChildrenNodeAfterAdd() {
let that = this;
this.loadNodeMap.forEach(function (value, key) {
GetTreeDataList({ parentId: key }).then((response) => {
that.$set(that.$refs.table.store.states.lazyTreeNodeMap, key, response.Data);
});
});
},
