1.背景:el-table在进行懒加载的时候,已经点开了某一行,再对数据添加子数据的时候,因为已经进行了懒加载,就不会再重新发请求获取子数据。
2.解决办法:这个时候需要重新渲染el-table获取数据,进行懒加载。
<el-table :data="tableData" :key="tableKey" :lazy="true" :load="loadData">
<el-table-column><template v-if="i.prop == 'name'">
<h-button
icon="el-icon-add"
type="text"
@click="addChildGroup(row)"
>{{ $t('添加') }}</h-button
></el-table-column>
</el-table>
data() {
return {
tableData: [], // 存储表格数据
tableKey: 0, // 表格的 key,初始值为 0
};
},
methods: {
// 加载数据的方法(loadData)等
// ...
reloadTable() {
// 当点击添加按钮时,更新 tableKey 的值,从而触发表格的重新加载
this.tableKey += 1;
},
addChildGroup(row){
。。。。。。。//进行添加数据之后
this.reloadTable()
}
}