feat: table expandedRowKeys support v-model, close #5695
parent
09cb907bee
commit
599b474ab7
|
@ -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,
|
||||||
|
|
|
@ -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" | - | |
|
||||||
|
|
|
@ -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" | - | |
|
||||||
|
|
|
@ -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);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue