这是因为在给table的数据赋值时，展开的视图对应的字段不存在。(动态增加属性)
拿到table数据后，先把展开字段初始化，然后再赋值，问题就解决了~~
比如，之前是：this.list = api.getList()
改成：let list = api.getList()
list.forEach((item)=>{
item.detail = '' // 假设展开的字段是detail
})
this.list = list
我实际的代码大概是这样的，一个table套另一个table
:data="list"
@expand-change="onExpandChange">
{{scope.row.name}}
:current-page="scope.row.page||1"
:total="scope.row.total||0"
@current-change="(page)=>onSubtablePageChange(page, scope.row)">
先调一个接口拿list的数据，然后再掉一个接口拿list[i].subTable的数据，第一个接口的数据没有subTable这个字段，所以后来再赋值的时候视图没有自动更新，只要在第一次拿数据的时候给每个数据加上这个字段就可以了method: {
拿外层table数据
async getList() {
let params = {
page: this.page,
}
let res = await task.getTaskList(params)
/*这里是要加的代码，把展开的字段加上去就好了*/
res.rows.forEach(row => {
row.subTable = []
row.total = 0
})
this.list = res.rows
this.total = res.total
},
拿展开的subtable数据
async getSubtable(row) {
let params = {
id: row.id,
page: row.page
}
if (!row || !row.id) {
return
}
let res = await task.getSubtable(params)
row.subTable = res.rows
row.total = res.total
},
}
-----------------分割线，下面的内容是之前写的，能解决问题，但是这种方法不好------------------
在更新数据后，调用一下this.$refs.table.toggleRowExpansion()就好了
/// 这不是“正确”的解决方法，只是我做了很多尝试之后试出来的一个 hack，很凑巧地能解决问题……
// 看源码，调用 toggleRowExpansion 方法，源码里会调用this.scheduleLayout(); 再调用 this.table.debouncedUpdateLayout(); 然后视图就更新了……
这样的页面：
代码：
// 省略其他代码
>
async getSubTable(row) {
let params = {
id: row.id,
page: row.page
}
let res = await task.getSubTable(params)
row.detail = res.rows
row.total = res.total
this.$refs.table.toggleRowExpansion()
},
