table icon indicating copy to clipboard operation
table copied to clipboard

make `rowKey` more type safe

Open woohm402 opened this issue 3 years ago • 1 comments

Describe the problem

https://github.com/react-component/table/blob/e23e391f4fc1fc884814c853fda580349024f783/src/Table.tsx#L119

From the source code, currently the type of rowKey attribute is string or callback function. However I think we can make the type of rowKey more precise.



What I suggest

Before

rowKey?: string | GetRowKey<RecordType>;

After

rowKey?: keyof RecordType | GetRowKey<RecordType>;

Because the rowKey attribute means that use dataSource[i][rowKey] as the key attribute that react wants.

This will make the type more precise. It will be nice that typescript can check if we have given the correct value to rowKey attribute.



Expected result

Before

const data = [{ id: 1, name: 'Tom' }, {id: 2, name: 'Bob' }];

return <Table dataSource={data} rowKey="username" />; // no error 😕 

After

const data = [{ id: 1, name: 'Tom' }, {id: 2, name: 'Bob' }];

return <Table dataSource={data} rowKey="username" />; // TS ERROR!

woohm402 avatar Feb 09 '22 03:02 woohm402

https://github.com/react-component/table/blob/75ee0064e54a4b3215694505870c9d6c817e9e4a/src/interface.ts#L76-L90

https://github.com/react-component/table/blob/75ee0064e54a4b3215694505870c9d6c817e9e4a/src/interface.ts#L56

Table.Column has a similar problem.

keyof RecordType | readonly (string|number)[] would be better...

wand2016 avatar Apr 07 '22 06:04 wand2016