From d27f288bc381dbe4bb93e426aee7b3fc62e960ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 14:14:53 +0800 Subject: [PATCH 1/7] feat: add header table --- docs/demo/components.md | 8 +++++++ docs/examples/components.tsx | 41 ++++++++++++++++++++++++++++++++++++ src/FixedHolder/index.tsx | 8 ++++--- src/interface.ts | 1 + 4 files changed, 55 insertions(+), 3 deletions(-) create mode 100644 docs/demo/components.md create mode 100644 docs/examples/components.tsx diff --git a/docs/demo/components.md b/docs/demo/components.md new file mode 100644 index 000000000..a3bc3ee9b --- /dev/null +++ b/docs/demo/components.md @@ -0,0 +1,8 @@ +--- +title: components +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/examples/components.tsx b/docs/examples/components.tsx new file mode 100644 index 000000000..e1b1b0996 --- /dev/null +++ b/docs/examples/components.tsx @@ -0,0 +1,41 @@ +import React from 'react'; +import Table from 'rc-table'; + +const data = []; +for (let i = 0; i < 100; i += 1) { + data.push({ + key: i, + a: `a${i}`, + b: `b${i}`, + c: `c${i}`, + }); +} + +const table = (props: any) => { + console.log('props', props); + return ( + <> +
111
+ {props.children}
+ + ); +}; + +const Demo = () => { + return ( +
+ + + ); +}; + +export default Demo; diff --git a/src/FixedHolder/index.tsx b/src/FixedHolder/index.tsx index 25fc5d1dd..55ed9e80c 100644 --- a/src/FixedHolder/index.tsx +++ b/src/FixedHolder/index.tsx @@ -63,11 +63,13 @@ const FixedHolder = React.forwardRef>( ...restProps } = props; - const { prefixCls, scrollbarSize, isSticky } = useContext(TableContext, [ + const { prefixCls, scrollbarSize, isSticky, getComponent } = useContext(TableContext, [ 'prefixCls', 'scrollbarSize', 'isSticky', + 'getComponent', ]); + const TableComponent = getComponent(['header', 'table'], 'table'); const combinationScrollBarSize = isSticky && !fixHeader ? 0 : scrollbarSize; @@ -146,7 +148,7 @@ const FixedHolder = React.forwardRef>( [stickyClassName]: !!stickyClassName, })} > -
>( columns: columnsWithScrollbar, flattenColumns: flattenColumnsWithScrollbar, })} -
+
); }); diff --git a/src/interface.ts b/src/interface.ts index 9513d3ce4..ee2199b7d 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -155,6 +155,7 @@ export type CustomizeScrollBody = ( export interface TableComponents { table?: CustomizeComponent; header?: { + table?: CustomizeComponent; wrapper?: CustomizeComponent; row?: CustomizeComponent; cell?: CustomizeComponent; From 116126b252bcdf1a15b9db5b096e836b4c6af29a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 14:15:28 +0800 Subject: [PATCH 2/7] feat: add header table --- docs/examples/components.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/examples/components.tsx b/docs/examples/components.tsx index e1b1b0996..b7647f52d 100644 --- a/docs/examples/components.tsx +++ b/docs/examples/components.tsx @@ -12,10 +12,9 @@ for (let i = 0; i < 100; i += 1) { } const table = (props: any) => { - console.log('props', props); return ( <> -
111
+
header table
{props.children}
); From 57eea958c8c18f0566cc299d32a295f2b1ec1817 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 14:21:24 +0800 Subject: [PATCH 3/7] feat: test --- tests/Sticky.spec.jsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index 34cc1cb8d..5682c542b 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -435,4 +435,18 @@ describe('Table.Sticky', () => { mockFn.mockRestore(); vi.useRealTimers(); }); + + it('components.table', () => { + const table = props => { + return ( + <> +
header table
+ {props.children}
+ + ); + }; + const wrapper = mount(createTable({ components: { header: { table } } })); + + expect(wrapper.exists('.healer-table')).toBeTruthy(); + }); }); From 987e5023f222c2c7407be08f79c4e9357d5fe883 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 15:00:12 +0800 Subject: [PATCH 4/7] feat: add createTable --- tests/Sticky.spec.jsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index 5682c542b..5b971ad37 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -5,6 +5,12 @@ import { act } from 'react-dom/test-utils'; import Table from '../src'; import { safeAct } from './utils'; +const createTable = props => { + const columns = [{ title: 'Name', dataIndex: 'name', key: 'name' }]; + + return ; +}; + describe('Table.Sticky', () => { beforeEach(() => { vi.useFakeTimers(); From b9c56ee9bf5f6ac640ec44e057e1335b0b314c6e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 15:08:04 +0800 Subject: [PATCH 5/7] feat: add data --- tests/Sticky.spec.jsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index 5b971ad37..2f044b36e 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -5,6 +5,10 @@ import { act } from 'react-dom/test-utils'; import Table from '../src'; import { safeAct } from './utils'; +const data = [ + { key: 'key0', name: 'Lucy' }, + { key: 'key1', name: 'Jack' }, +]; const createTable = props => { const columns = [{ title: 'Name', dataIndex: 'name', key: 'name' }]; From 273e5fae1ab7e94214c56a4e39ab5a6c8a2736e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 15:14:03 +0800 Subject: [PATCH 6/7] feat: test --- tests/FixedColumn.spec.tsx | 27 +++++++++++++++++++++++++++ tests/Sticky.spec.jsx | 24 ------------------------ 2 files changed, 27 insertions(+), 24 deletions(-) diff --git a/tests/FixedColumn.spec.tsx b/tests/FixedColumn.spec.tsx index 5b8585686..9302b1cf1 100644 --- a/tests/FixedColumn.spec.tsx +++ b/tests/FixedColumn.spec.tsx @@ -284,4 +284,31 @@ describe('Table.FixedColumn', () => { }); }); }); + describe('components.table by sticky', () => { + it('render', async () => { + const table = props => { + return ( + <> +
header table
+
{props.children}
+ + ); + }; + const { container } = render( + , + ); + + await act(async () => { + vi.runAllTimers(); + await Promise.resolve(); + }); + + expect(container.querySelector('.healer-table')).toBeTruthy(); + }); + }); }); diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index 2f044b36e..34cc1cb8d 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -5,16 +5,6 @@ import { act } from 'react-dom/test-utils'; import Table from '../src'; import { safeAct } from './utils'; -const data = [ - { key: 'key0', name: 'Lucy' }, - { key: 'key1', name: 'Jack' }, -]; -const createTable = props => { - const columns = [{ title: 'Name', dataIndex: 'name', key: 'name' }]; - - return
; -}; - describe('Table.Sticky', () => { beforeEach(() => { vi.useFakeTimers(); @@ -445,18 +435,4 @@ describe('Table.Sticky', () => { mockFn.mockRestore(); vi.useRealTimers(); }); - - it('components.table', () => { - const table = props => { - return ( - <> -
header table
-
{props.children}
- - ); - }; - const wrapper = mount(createTable({ components: { header: { table } } })); - - expect(wrapper.exists('.healer-table')).toBeTruthy(); - }); }); From 8bb09e61766fb191a3a453d8d5c72b6862f0a258 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8F=B6=E6=9E=AB?= <645381995@qq.com> Date: Wed, 31 Jan 2024 15:27:02 +0800 Subject: [PATCH 7/7] =?UTF-8?q?feat:=20=E7=B2=BE=E7=AE=80=E4=BB=A3?= =?UTF-8?q?=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- tests/FixedColumn.spec.tsx | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/tests/FixedColumn.spec.tsx b/tests/FixedColumn.spec.tsx index 9302b1cf1..7f252a396 100644 --- a/tests/FixedColumn.spec.tsx +++ b/tests/FixedColumn.spec.tsx @@ -294,20 +294,7 @@ describe('Table.FixedColumn', () => { ); }; - const { container } = render( - , - ); - - await act(async () => { - vi.runAllTimers(); - await Promise.resolve(); - }); - + const { container } = render(
); expect(container.querySelector('.healer-table')).toBeTruthy(); }); });