2025年React.js表格Table UI组件推荐 Data Grid数据表格

360影视 2025-01-14 13:26 2

摘要:数据表格Data Grid是前端开发常用的需求,一般情况下直接使用UI组件库提供的表格,比如Ant Design组件库中的Table组件,然而UI组件库是广度不如深度,在实现表格/列表时,如果功能无法满足或性能不够时,可以考虑使用专门的数据表格组件。以下是一些

数据表格Data Grid是前端开发常用的需求,一般情况下直接使用UI组件库提供的表格,比如Ant Design组件库中的Table组件,然而UI组件库是广度不如深度,在实现表格/列表时,如果功能无法满足或性能不够时,可以考虑使用专门的数据表格组件。以下是一些开源的表格组件,为开发提供一些参考。

数据:Star 13.2K、Fork 1.9K、140+贡献者、issues 6K+、PR 3K+、42K+ Commit

优点:专业的JavaScript网页表格组件,支持Angular、Vue、react框架,可作展示列表,可作数据编辑表格、支持框选和复制粘贴等类Excel特性、用户量大,可升级商业版。

缺点:外国软件,可能不适合国内用户,商业版价格较贵,对于小企业可能没有购买的必要,而免费版缺少一些功能比如树形数据。免费版不支持聚合计算、TreeData、上下文菜单(右键菜单)等,需要商业版。

数据:Star 8K、Fork 698、3.7K+ Commit

优点:电子表格前端组件,支持React, Vue, js等框架,国产框架,较为强大的Excel网页组件。目标远大,支持Excel、Docs、PPT功能,但是开发进度有限。

缺点:老项目上升级重构而来,老版本本身就是废弃物,新项目却还处于积极开发中,比如打印功能,存在新版本和老版本的选择困难。

数据:Star 25.6K、Fork 3.1K、452+贡献者、issues 2.2K+、PR 1.2K+、2.4K+ Commit

优点:专业的JavaScript网页表格组件,支持React, Vue, Solid, Svelte & Lit等框架,用户量大。

缺点:外国软件,可能不适合国内用户、默认的UI界面不够大气(支持Material UI)、不支持框选。

数据:Star 4.6K、Fork 1.4K、462+贡献者、issues 6.5K+、PR 9.2K+、8.2K+ Commit

优点:免费的表格组件,用户量大,可升级商业版。

缺点:外国软件,可能不适合国内用户、免费版不支持树形数据等。

Griddle

数据:Star 2.5K、Fork 379+、71+贡献者、issues 400+、PR250+、1.2K+ Commit

优点:简单的表格组件,极简UI。

缺点:只具备基本功能。

数据:Star 7.1K、Fork 2.2K、120+贡献者、issues 1.5K+、PR 1.8K+、2.5K+ Commit

优点:免费的表格组件,用户量大、支持树形数据、有类似Excel网格支持。

缺点:外国软件,可能不适合国内用户、不支持框选。

数据:Star 5.4K、Fork 453、38+贡献者、issues 0.2K+、PR 0.1K+、0.29K+ Commit

优点:免费的类似Excel网格表格,支持框选,支持复制和粘贴、简单、支持自定义。

缺点:外国软件,没有官方中文文档支持等。

数据:Star 1.8K、Fork 174、16+贡献者、issues 0.21K+、PR 0.05K+、0.2K+ Commit

优点:免费的类似Excel网格表格,支持框选,支持复制和粘贴、右键菜单、简单、支持自定义、文档和示例丰富。

缺点:外国软件,没有官方中文文档支持、不支持撤销操作等。

数据:Star 597、Fork 87

优点:一个功能强大的表格编辑组件,主打数据的编辑操作、有类似Excel网格支持、支持框选和复制粘贴、支持撤销操作、有丰富的操作菜单支持、可以作为一个网页版Excel使用(未深入体验)。

缺点:外国软件,可能不适合国内用户、活跃度较低,有开源代码但是没有免费选项,需要购商业版。打印功能很废,不是打印表格数据而是打印网格,正确做法应该是提取数据后重新渲染打印页内容,而不是直接打印所在网页这么敷衍。

数据:Star 20.3K、Fork 3.1K、16+贡献者、issues 7K+、PR 2.8K+、8.5K+ Commit

优点:专业表格组件,支持,Vue2、Vue3、React、Angular、JavaScript等框架、支持SSR服务端渲染。官方文档和示例详细且丰富,类Excel数据编辑表格,支持框选、复制粘贴、支持撤销操作。

缺点:外国软件,可能不适合国内用户、无官方中文文档支持。商用使用需要购买商业版,功能上没有发现区别(个人非商业免费)。

数据:Star 1.1K、Fork 150

优点:简单的表格组件,也有特色比如只看单条数据切换支持。

缺点:功能较少

数据:Star 19、Fork 2

优点:一个支持AI、支持实时数据,功能强大的数据表格组件,支持React、Angular、Vue、Svelte等框架,有免费版和专业版。类Excel数据表,支持框选和复制粘贴,支持撤销。

缺点:开源社区活跃度太低了。

数据:Star 4.2、Fork 308

优点:一个支持实时数据,功能强大的数据表格组件,类Excel数据表,支持框选和复制,支持撤销、开发文档详细丰富、有强大的在线演示系统。

缺点:外国软件,没有官方中文文档,框选可以复制但不支持粘贴,不知道是不是我没有开启配置项原因。

数据:Star 98、Fork 6

优点:一个类Excel数据表,支持框选和复制,支持撤销。

缺点:外国软件,没有官方中文文档。

阿里 - 很易用的中后台「表单 / 表格 / 图表」解决方案

数据:Star 7.2K、Fork 1.2K

优点:一个网页数据展示表格,阿里出品。

缺点:和Ant Design Pro的ProTable差不多,官方演示页出现渲染错误,没有和Vue开发的Vxe-Table一样的高度自适应。

数据:Star 3.5K、Fork 1K

优点: MD风格的表格组件、开源免费、支持筛选、树形数据等常用表格功能。

缺点: 无中文文档,对于一部分人来说不友好。

数据:Star 2.1K、Fork 414

优点:一个功能齐全,文档丰富的表格组件

缺点:无官方中文文档,UI没那么丰富。

Rc-Table

数据:Star 1.3K、Fork 592

优点:React基础表格组件,Ant Design表格的基础库,适合二次定制开发。

数据:Star 1.6K、Fork 464

优点:又一个MD风格的表格UI组件,功能齐全

缺点:无中文文档

S2 Table

数据:Star 1.5K、Fork 199

优点:阿里系开源免费的js图表库适合数据分析展示的数据统计表格。

缺点:支持的统计类型可能有限,不一定满足更多需求。

数据:Star 1.5K、Fork 164

优点:大量数据展示的表格组件,api接口丰富。

缺点:虽然看起来类Excel,但不支持框选等操作,不支持树形数据

数据:Star 1.5K、Fork 130

优点:京东开发的表格组件,主要可视化动态表格生成。

缺点:功能强大,但集成后端操作可能较为复杂

数据:Star 1.3K、Fork 141

优点:电子表格组件、免费开源,类似Excel,支持丰富的api功能,支持树形数据等。

缺点:框选复制粘贴操作有些问题

数据:Star 2.2K、Fork 781

优点:React开发的Bootstrap表格组件

缺点:没啥优势

数据:Star 1.3K、Fork 429

优点:另一个React开发的Bootstrap表格组件

缺点:没啥优势

数据:Star 1.3K、Fork 290

优点:一个具备基本功能的数据表格组件

缺点:没有特色

数据:Star 1.2K、Fork 39

优点:虚拟列表渲染组件

缺点:封装较简单,适合自己扩展

数据:Star 1.1K、Fork 55

优点:Excel风格表格组件

缺点:不支持框选等操作

数据:Star 990、Fork 69

优点:开源免费的数据表格展示组件,支持树形数据,支持展开操作,支持样式等基本功能

缺点:没有特别的缺陷,也没有特别突出的功能。

数据:Star 961、Fork 316

优点:又一个阿里巴巴开源的高性能 React 表格组件,支持大数据量渲染。

缺点:作者暂停维护,不过开源的,可以自己修改源码,有问题可以改代码。

Ka-Table

数据:Star 805、Fork 64

优点:开源免费、功能丰富的表格组件。

缺点:无中文文档

数据:Star 914、Fork 142

优点:轻量级的开源免费表格组件

缺点:UI界面简陋

数据:Star 755、Fork 48

优点:功能完备的基础数据表格组件,支持树形数据

缺点:UI较为简陋,但可以添加MD风格支持

数据:Star697、Fork 87

优点:专注可编辑的轻量级表格组件

缺点:开发路线完善度较低

数据:Star 726、Fork 132

优点:基础数据表格组件,支持常见功能拖拽、树形数据、展开数据、虚拟列表等

缺点:缺少分页等功能

数据:Star 4.4K、Fork 1.4K

优点:专业、功能强大的网页数据展示表格,集成了筛选搜索、分页、过滤等操作,如果是React开发后台需要数据列表那使用此组件可作为首选。

数据:Star 188、Fork 22

优点:一个专门收集表格组件的项目,可以在这里查看你需要的js表格,但是只是列出功能和数据以及链接,且没啥人气,但我推荐你可以收藏一下。

来源:安浪

相关推荐