AG Grid依赖
为实现页面表格的展示需求,进行的技术调研
官网地址:https://www.ag-grid.com/
GitHub地址:https://github.com/ag-grid/ag-grid
核心需求
1、大数据量的支持
AG Grid本身具有虚拟列表滚动的形式来极大的提高渲染性能。满足对大数据量的支持。
官方说明:https://www.ag-grid.com/react-data-grid/dom-virtualisation/
Demo示例:模拟10万条渲染数据
2、分级
AG Grid具有Group组及Tree Data树数据的概念,具备多级展示的功能。满足分级展示的需求。
但未找到专门实现分组自定义样式的功能
官方说明:https://www.ag-grid.com/react-data-grid/tree-data/
Demo示例:官方示例
3、样式导出到Excel
AG Grid对Excel的导出提供了特殊机制,可将样式添加到导出到Excel文件。
官方说明:https://www.ag-grid.com/react-data-grid/excel-export-styles/
Demo示例:下图分别为官网页面demo展示、官网demo下载后的Excel展示、实际开发设置简单样式下载后的Excel
其他功能需求
- 支持一键展开关闭所有树结构、支持按级展开树结构、支持判断条件展开树结构
官方说明:https://www.ag-grid.com/react-data-grid/server-side-model-grouping/#expand-all–collapse-all - 支持列的移动、过滤、排序等
- 支持语言本地化配置
- 支持自定义右键弹出菜单的样式设置
FAQ
1、该依赖库分为社区版和企业版。企业版可免费试用,但要求不可再生产项目中使用。
核心需求中的树结构分级及导出为Excel功能均属于企业版功能
官方说明:https://www.ag-grid.com/react-data-grid/licensing/
定价说明:https://www.ag-grid.com/license-pricing/