virtual-table-ant-design

The virtual table based on ant-design@4.x is simple and easy to use, without changing the original table component.

Since peerDependencies are used, please make sure to use reac and antd in your project, see package.json for details.

The project was packaged by rollup, exported CommonJS and ESModule modules, and used prettier to beautify the code.

Try it out: https://codesandbox.io/s/awesome-virtual-table-wxqc9

Install

1npm install -D virtual-table-ant-design

Usage

1import { VList } from 'virtual-table-ant-design'

1import { Table } from 'antd'
2
3<Table
4  rowSelection={rowSelection}
5  pagination={false}
6  rowKey="id"
7  dataSource={dataSource}
8  columns={columns}
9  loading={loading}
10  scroll={{ y: '50vh', x: true }}
11  components={VList({
12    height: 500,
13  })}
14/>

Document

• https://github.com/ant-design/ant-design/blob/1c85bb3b6231a01c53c53204846a03c4cfdf41f9/components/table/interface.tsx#L39

• https://marvinsblog.net/post/2018-12-23-rollup-typescript-react/