virtualizedtableforantdnested
v1.1.4
Published
The virtualized table component for ant design4, using typescript. Supports nested table rows.
Downloads
12
Maintainers
Readme
The virtualized table component for AntD4,fast, restorable and smallest size for gzip!
Install
npm i --save virtualizedtableforantd4
the opts of
useVT
(examples)interface vt_opts { id?: number; /** * @default 5 */ overscanRowCount?: number; /** * this only needs the scroll.y */ scroll?: { y: number; }; /** * wheel event(only works on native events). */ onScroll?: ({ left, top, isEnd, }: { top: number; left: number; isEnd: boolean }) => void; initTop?: number; /** * @default false */ debug?: boolean; // pass -1 means scroll to the bottom of the table ref?: React.MutableRefObject<{ scrollTo: (y: number) => void; }> }
Quick start
You need to change your style like following if your Table.size is not default.
如果你的Table.size不是默认的话,你需要修改像下面一样的style。
// size={'small'} ant-table [vt] > table > .ant-table-tbody > tr > td { padding: 8px; }
import React from 'react'; import { Table } from 'antd'; import { useVT } from 'virtualizedtableforantd4'; const [ vt, set_components ] = useVT(() => ({ scroll: { y: 600 } }), []); <Table scroll={{ y: 600 }} // It's important for using VT!!! DO NOT FORGET!!! components={vt} columns={/*your columns*/} dataSource={/*your data*/} />
Scroll to
Restoring last state
Editable Table
Drag soring