feat: table expandedRowKeys support v-model, close #5695

Author: tangjinzhou

components/table/Table.tsx

@@ -156,6 +156,10 @@ export const tableProps = () => {
       type: Function as PropType<TableProps['onExpandedRowsChange']>,
       default: undefined,
     },
+    'onUpdate:expandedRowKeys': {
+      type: Function as PropType<TableProps['onExpandedRowsChange']>,
+      default: undefined,
+    },
     defaultExpandAllRows: {
       type: Boolean as PropType<TableProps['defaultExpandAllRows']>,
       default: undefined,

components/table/index.en-US.md

@@ -82,7 +82,7 @@ Specify `dataSource` of Table as an array of data.
 | defaultExpandAllRows | Expand all rows initially | boolean | `false` |  |
 | defaultExpandedRowKeys | Initial expanded row keys | string\[] | - |  |
 | emptyText | Customize the display content when empty data | v-slot:emptyText | - | 3.0 |
-| expandedRowKeys | Current expanded row keys | string\[] | - |  |
+| expandedRowKeys(v-model) | Current expanded row keys | string\[] | - |  |
 | expandedRowRender | Expanded container render for each row | Function({record, index, indent, expanded}):VNode\|v-slot | - |  |
 | expandFixed | Set column to be fixed: `true`(same as left) `'left'` `'right'` | boolean \| string | false | 3.0 |
 | expandIcon | Customize row expand Icon. | Function(props):VNode \| v-slot:expandIcon="props" | - |  |

components/table/index.zh-CN.md

@@ -87,7 +87,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/f-SbcX2Lx/Table.svg
 | defaultExpandAllRows | 初始时，是否展开所有行 | boolean | false |  |
 | defaultExpandedRowKeys | 默认展开的行 | string\[] | - |  |
 | emptyText | 自定义空数据时的显示内容 | v-slot:emptyText | - | 3.0 |
-| expandedRowKeys | 展开的行，控制属性 | string\[] | - |  |
+| expandedRowKeys(v-model) | 展开的行，控制属性 | string\[] | - |  |
 | expandedRowRender | 额外的展开行 | Function(record, index, indent, expanded):VNode \| v-slot:expandedRowRender="{record, index, indent, expanded}" | - |  |
 | expandFixed | 控制展开图标是否固定，可选 true `left` `right` | boolean \| string | false | 3.0 |
 | expandIcon | 自定义展开图标 | Function(props):VNode \| v-slot:expandIcon="props" | - |  |

components/vc-table/Table.tsx

@@ -177,6 +177,7 @@ export default defineComponent<TableProps<DefaultRecordType>>({
     'expandIcon',
     'onExpand',
     'onExpandedRowsChange',
+    'onUpdate:expandedRowKeys',
     'defaultExpandAllRows',
     'indentSize',
     'expandIconColumnIndex',
@@ -192,7 +193,7 @@ export default defineComponent<TableProps<DefaultRecordType>>({
     'transformCellText',
   ] as any,
   slots: ['title', 'footer', 'summary', 'emptyText'],
-  emits: ['expand', 'expandedRowsChange', 'updateInternalRefs'],
+  emits: ['expand', 'expandedRowsChange', 'updateInternalRefs', 'update:expandedRowKeys'],
   setup(props, { attrs, slots, emit }) {
     const mergedData = computed(() => props.data || EMPTY_DATA);
     const hasData = computed(() => !!mergedData.value.length);
@@ -289,6 +290,7 @@ export default defineComponent<TableProps<DefaultRecordType>>({
       innerExpandedKeys.value = newExpandedKeys;
 
       emit('expand', !hasKey, record);
+      emit('update:expandedRowKeys', newExpandedKeys);
       emit('expandedRowsChange', newExpandedKeys);
     };