vue ant a-table 嵌套子表格 刷新折叠所有的行
时间: 2023-10-06 15:09:09 浏览: 125
你可以使用 `expandedRowKeys` 属性来实现折叠/展开所有行。具体做法如下:
1. 给 `a-table` 添加一个 `ref`,例如 `tableRef`。
2. 在需要折叠/展开所有行的时候,调用 `tableRef.toggleAllExpand(expanded)` 方法,其中 `expanded` 是一个布尔值,表示是否展开。
以下是示例代码:
```html
<template>
<a-table ref="tableRef" :expanded-row-keys="expandedRowKeys" @expand="handleExpand">
<!-- 表格列定义 -->
</a-table>
<a-button @click="toggleAllExpand">折叠/展开所有行</a-button>
</template>
<script>
export default {
data() {
return {
expandedRowKeys: [],
};
},
methods: {
handleExpand(row, expanded) {
if (expanded) {
this.expandedRowKeys.push(row.key);
} else {
const index = this.expandedRowKeys.indexOf(row.key);
if (index !== -1) {
this.expandedRowKeys.splice(index, 1);
}
}
},
toggleAllExpand() {
this.$refs.tableRef.toggleAllExpand(!this.expandedRowKeys.length);
},
},
};
</script>
```