From df29f62d5107a8ed2ef9c170ae1f78a33df3d317 Mon Sep 17 00:00:00 2001 From: heart <7362469@qq.com> Date: Tue, 16 Jan 2024 21:31:01 +0800 Subject: [PATCH 1/2] fix: fix headerCell slots --- components/table/hooks/useColumns.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/components/table/hooks/useColumns.tsx b/components/table/hooks/useColumns.tsx index aab022e250..2947458985 100644 --- a/components/table/hooks/useColumns.tsx +++ b/components/table/hooks/useColumns.tsx @@ -1,10 +1,10 @@ import devWarning from '../../vc-util/devWarning'; -import { renderSlot } from 'vue'; -import type { Ref } from 'vue'; +import type { Ref, VNode } from 'vue'; import type { ContextSlots } from '../context'; import type { TransformColumns, ColumnsType } from '../interface'; import { SELECTION_COLUMN } from './useSelection'; import { EXPAND_COLUMN } from '../../vc-table'; +import { customRenderSlot } from '../../_util/vnode'; function fillSlots(columns: ColumnsType, contextSlots: Ref) { const $slots = contextSlots.value; @@ -27,7 +27,7 @@ function fillSlots(columns: ColumnsType, contextSlots: R }); if (contextSlots.value.headerCell && !column.slots?.title) { - cloneColumn.title = renderSlot( + cloneColumn.title = customRenderSlot( contextSlots.value, 'headerCell', { @@ -35,7 +35,7 @@ function fillSlots(columns: ColumnsType, contextSlots: R column, }, () => [column.title as any], - ); + ) as VNode[]; } if ('children' in cloneColumn && Array.isArray(cloneColumn.children)) { cloneColumn.children = fillSlots(cloneColumn.children, contextSlots); From 9addc934f2ac3a7502432cd9037ce5929b9ed0ad Mon Sep 17 00:00:00 2001 From: heart <7362469@qq.com> Date: Tue, 16 Jan 2024 22:25:54 +0800 Subject: [PATCH 2/2] perf: optimize table columnTitle type --- components/table/hooks/useColumns.tsx | 4 ++-- components/table/interface.tsx | 7 +++++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/components/table/hooks/useColumns.tsx b/components/table/hooks/useColumns.tsx index 2947458985..3f1a5304bd 100644 --- a/components/table/hooks/useColumns.tsx +++ b/components/table/hooks/useColumns.tsx @@ -1,5 +1,5 @@ import devWarning from '../../vc-util/devWarning'; -import type { Ref, VNode } from 'vue'; +import type { Ref } from 'vue'; import type { ContextSlots } from '../context'; import type { TransformColumns, ColumnsType } from '../interface'; import { SELECTION_COLUMN } from './useSelection'; @@ -35,7 +35,7 @@ function fillSlots(columns: ColumnsType, contextSlots: R column, }, () => [column.title as any], - ) as VNode[]; + ); } if ('children' in cloneColumn && Array.isArray(cloneColumn.children)) { cloneColumn.children = fillSlots(cloneColumn.children, contextSlots); diff --git a/components/table/interface.tsx b/components/table/interface.tsx index 1cb05c11eb..9f620049d0 100644 --- a/components/table/interface.tsx +++ b/components/table/interface.tsx @@ -13,7 +13,7 @@ import type { Breakpoint } from '../_util/responsiveObserve'; import type { INTERNAL_SELECTION_ITEM } from './hooks/useSelection'; import type { VueNode } from '../_util/type'; import { tuple } from '../_util/type'; -import type { CSSProperties } from 'vue'; +import type { CSSProperties, VNodeArrayChildren } from 'vue'; // import { TableAction } from './Table'; export type { GetRowKey, ExpandableConfig }; @@ -68,7 +68,10 @@ export interface ColumnTitleProps { filters?: Record; } -export type ColumnTitle = VueNode | ((props: ColumnTitleProps) => VueNode); +type ColumnTitleNode = VueNode | VNodeArrayChildren; +export type ColumnTitle = + | ColumnTitleNode + | ((props: ColumnTitleProps) => ColumnTitleNode); export type FilterValue = (Key | boolean)[]; export type FilterKey = Key[] | null;