之前一直用antd的表单组件，后来发现每页数量只要大于500滚动就比较卡顿，后来就沿着虚拟滚动找到了ali-react-table这个表格组件，ali-react-table也没让我失望，开启虚拟滚动真的流畅，2000一页也不卡。

打开网易新闻 查看精彩图片

特点

  • 高性能，内置虚拟滚动，数据量较大时自动开启
  • 简单灵活的 API，丰富的定制能力
  • 实用的表格特性：表头吸顶 & 左侧/右侧锁列 & 粘性定位的滚动条

表格适用场景

  • 需要用表格展示大量数据，对表格性能较为敏感
  • 页面本身没有引入组件库（可能是出于页面体积的考量），缺少开箱可用的 React 表格
  • 组件库所提供的表格组件可定制能力不够，需要更加灵活的表格组件

打开网易新闻 查看精彩图片
打开网易新闻 查看精彩图片

官网示例有数据报表，树表，透视表，交叉表。这个表组件我是实际用于生产环境的，与antd表格交替使用，用法基本无异，相比antd table组件，ali-react-table大数据量渲染快，缺点就是有些细节不如antd table，比如分页功能要自己实现，antd table是封装好的。

目前github上start只有737个，对于表格有性能需求的可以上。

项目官网：https://ali-react-table.js.org/

Github项目地址：https://github.com/alibaba/ali-react-table