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

pull/5702/head
tangjinzhou 2022-06-13 09:35:03 +08:00
parent 09cb907bee
commit 599b474ab7
4 changed files with 9 additions and 3 deletions

View File

@ -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,

View File

@ -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" | - | |

View File

@ -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" | - | |

View File

@ -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);
};