需求是点击后请求接口数据，然后展示在下方
截图20211110165600.png
使用的是expand-change事件处理。
- 直接往表格中每一行添加的一个字段，用于在下方展示。表格出现了需要点击两下，表格才会重新刷新。 使用了
dolayout和this.$forceUpdate()都没有作用。
解决办法：后来采用的是将表格重新赋值。2. 表格出现可以刷新，但是会闪一下，并且点不开。
解决办法：后面加上row-key="id"，正常了
<el-table ref="table" row-key="id" :data="rows" size="mini" header-cell-class-name="header-bg" @expand-change="load">
<el-table-column type="expand">
<template slot-scope="scope">
//表格点击后中展示的地方
</template>
</el-table-column>
<el-table-column label="出发港" width="100">
<template slot-scope="scope">
{{ scope.row.pol }}
</template>
</el-table-column>
</el-table>
async load(row) {
const res = await matrixDetail.get({ matrixId: row.id })
const tables = this.rows
tables.forEach((item, index) => {
if (item.id === row.id) {
item['units'] = res.content
}
})
this.rows = JSON.parse(JSON.stringify(tables))
},
