diff --git a/packages/table/src/store/watcher.ts b/packages/table/src/store/watcher.ts index 10deb79602..014716a200 100644 --- a/packages/table/src/store/watcher.ts +++ b/packages/table/src/store/watcher.ts @@ -120,9 +120,9 @@ function useWatcher() { updateColumns() } if (immediate) { - instance.vnode.state.doLayout() + instance.state.doLayout() } else { - instance.vnode.state.debouncedUpdateLayout() + instance.state.debouncedUpdateLayout() } } diff --git a/packages/table/src/table-header/index.ts b/packages/table/src/table-header/index.ts index 1c12b427cd..a414975cc0 100644 --- a/packages/table/src/table-header/index.ts +++ b/packages/table/src/table-header/index.ts @@ -79,7 +79,7 @@ export default defineComponent({ } = useStyle(props) const { isGroup, toggleAllSelection, columnRows } = useUtils(props) - instance.vnode.state = { + instance.state = { onColumnsChange, onScrollableChange, } diff --git a/packages/table/src/table-header/utils-helper.ts b/packages/table/src/table-header/utils-helper.ts index d802fe44b4..71fa82a217 100644 --- a/packages/table/src/table-header/utils-helper.ts +++ b/packages/table/src/table-header/utils-helper.ts @@ -69,7 +69,7 @@ function useUtils(props: TableHeaderProps) { }) const isGroup = computed(() => { const result = columnRows.value.length > 1 - if (result) parent.vnode.state.isGroup.value = true + if (result) parent.state.isGroup.value = true return result }) const toggleAllSelection = (event: Event) => { diff --git a/packages/table/src/table-layout.ts b/packages/table/src/table-layout.ts index 0ad3c680dc..0eeccd7c29 100644 --- a/packages/table/src/table-layout.ts +++ b/packages/table/src/table-layout.ts @@ -242,7 +242,7 @@ class TableLayout { } this.bodyWidth.value = Math.max(bodyMinWidth, bodyWidth) - this.table.vnode.state.resizeState.value.width = this.bodyWidth.value + this.table.state.resizeState.value.width = this.bodyWidth.value } else { flattenColumns.forEach(column => { if (!column.width && !column.minWidth) { @@ -298,10 +298,10 @@ class TableLayout { observers.forEach(observer => { switch (event) { case 'columns': - observer.vnode.state?.onColumnsChange(this) + observer.state?.onColumnsChange(this) break case 'scrollable': - observer.vnode.state?.onScrollableChange(this) + observer.state?.onScrollableChange(this) break default: throw new Error(`Table Layout don't have event ${event}.`) diff --git a/packages/table/src/table.d.ts b/packages/table/src/table.d.ts index 9e83b16aaf..c4ccb5852d 100644 --- a/packages/table/src/table.d.ts +++ b/packages/table/src/table.d.ts @@ -267,7 +267,7 @@ interface TableRefs { [key: string]: unknown } -interface TableVnodeState { +interface TableState { isGroup: Ref resizeState: Ref<{ width: any @@ -289,18 +289,14 @@ interface Table extends ComponentInternalInstance { layout: TableLayout refs: TableRefs tableId: string - vnode: VNode & { - state: TableVnodeState - } + state: TableState } interface TableHeader extends ComponentInternalInstance { - vnode: { - state: { - onColumnsChange - onScrollableChange - } - } & VNode + state: { + onColumnsChange + onScrollableChange + } filterPanels: Ref } diff --git a/packages/table/src/table.vue b/packages/table/src/table.vue index 7c669150d0..ed8eb94039 100644 --- a/packages/table/src/table.vue +++ b/packages/table/src/table.vue @@ -392,7 +392,7 @@ export default defineComponent({ const tableId = 'el-table_' + tableIdSeed++ table.tableId = tableId - table.vnode.state = { + table.state = { isGroup, resizeState, doLayout,