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']>, type: Function as PropType<TableProps['onExpandedRowsChange']>,
default: undefined, default: undefined,
}, },
'onUpdate:expandedRowKeys': {
type: Function as PropType<TableProps['onExpandedRowsChange']>,
default: undefined,
},
defaultExpandAllRows: { defaultExpandAllRows: {
type: Boolean as PropType<TableProps['defaultExpandAllRows']>, type: Boolean as PropType<TableProps['defaultExpandAllRows']>,
default: undefined, default: undefined,

View File

@ -82,7 +82,7 @@ Specify `dataSource` of Table as an array of data.
| defaultExpandAllRows | Expand all rows initially | boolean | `false` | | | defaultExpandAllRows | Expand all rows initially | boolean | `false` | |
| defaultExpandedRowKeys | Initial expanded row keys | string\[] | - | | | defaultExpandedRowKeys | Initial expanded row keys | string\[] | - | |
| emptyText | Customize the display content when empty data | v-slot:emptyText | - | 3.0 | | 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 | - | | | 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 | | 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" | - | | | 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 | | | defaultExpandAllRows | 初始时,是否展开所有行 | boolean | false | |
| defaultExpandedRowKeys | 默认展开的行 | string\[] | - | | | defaultExpandedRowKeys | 默认展开的行 | string\[] | - | |
| emptyText | 自定义空数据时的显示内容 | v-slot:emptyText | - | 3.0 | | 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}" | - | | | expandedRowRender | 额外的展开行 | Function(record, index, indent, expanded):VNode \| v-slot:expandedRowRender="{record, index, indent, expanded}" | - | |
| expandFixed | 控制展开图标是否固定,可选 true `left` `right` | boolean \| string | false | 3.0 | | expandFixed | 控制展开图标是否固定,可选 true `left` `right` | boolean \| string | false | 3.0 |
| expandIcon | 自定义展开图标 | Function(props):VNode \| v-slot:expandIcon="props" | - | | | expandIcon | 自定义展开图标 | Function(props):VNode \| v-slot:expandIcon="props" | - | |

View File

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