本发明属于计算机，具体涉及一种基于react的表格扩展系统及方法。
背景技术：
1、目前成熟的表格组件如antd-design的表格组件有着强大的功能和可扩展性，在各个项目中基本可以实现开箱即用，通过样式覆盖和全局配置，基本可以贴合各个项目的ui风格。
2、但是对于复杂项目上的需求，就不得不对表格组件进行二次封装，舍弃组件部分功能或在组件原有功能上做一些更加贴合项目需求的功能扩展。为了实现这些功能，通常需要使用组件自身暴露的api重写render部分代码，这导致开发的工作量及复杂程度无异于重新开发一个组件。而且对于单元格使用render重写渲染逻辑会导致每个单元格都加入了对当前行数据的依赖，增加没必要的前端渲染，降低性能。而且在经过数个项目的迭代后，组件为了支撑各个项目的需求会变得异常臃肿，维护成本越来越高，刚接触组件的开发人员需要花大量时间来阅读并熟悉代码，极大地延长了开发周期。
3、造成这一结果的主要原因是antd-design的表格组件，只负责将数据以表格的形式展示。而不关注数据在表格内部的展现形式。这导致即使使用表格展示例如形如链接、标签、枚举、日期等等常见数据展现形式也需要通过重写渲染逻辑来实现。
技术实现思路
1、本发明旨在解决现有技术的不足，提供了如下方案：
2、一种基于react的表格扩展系统，包括：全局配置项封装模块、固定模块、列配置模块和数据展示模块；
3、所述全局配置项封装模块将全局配置项进行封装，并在表格组件渲染和项目加载前对表格中的现有配置项进行全局配置替换；
4、所述固定模块用于使用基础表格进行表头固定和列固定，并使用若干基础表格重叠展示；
5、所述列配置模块用于在组件渲染前向表格配置列中添加列配置信息；
6、所述数据展示模块用于将用户输入的原始数据进行处理，并渲染更新用户可视区域内的数据，完成数据展示。
7、优选的，所述全局配置封装模块包括：修改配置单元和读取配置单元；
8、所述修改配置单元采用比较合并的方式将前后两次的配置转成字符串进行全等比较，若发现前后两次的配置有不同，则通过扩展运算符进行配置的合并，将老配置替换为新配置；
9、所述读取配置单元用于读取指定配置或所有配置。
10、优选的，所述固定模块的工作流程包括：
11、编写具有基本展示功能的所述基础表格，所述基础表格自身使用自定义滚动条实现表头固定；
12、之后使用3个所述基础表格重叠展示，分别展示非固定列、左固定列、右固定列，完成表格固定表头及固定列的展示效果。
13、优选的，所述列配置模块的工作流程包括：勾选列配置信息，通过组件的props将所述列配置信息发送到内部表格组件来判断否需要展示序号列、选择列及操作列的配置，若判断为需要，则在组件渲染之前向列配置中添加相关的所述列配置信息。
14、优选的，所述数据展示模块的工作流程包括：
15、将用户输入的所述原始数据进行处理得到数据项，判断用户界面中可视区域的尺寸和数据项大小，判断所述可视区域中的存在的待渲染数据项，并对所述待渲染数据项进行渲染，展示渲染后数据项；
16、当所述可视区域中的所述待渲染数据项发生变化更新时，移除并缓存不再可见的所述渲染后数据项，重新渲染更新后的所述待渲染数据项，并重现展示所述渲染后数据项。
17、本发明还提供了一种基于react的表格扩展方法，所述方法应用于上述任一项所述的系统，包括以下步骤：
18、将全局配置项进行封装，并在表格组件渲染和项目加载前对表格中的现有配置项进行全局配置替换；
19、使用基础表格进行表头固定和列固定，并使用若干基础表格重叠展示；
20、在组件渲染前向表格配置列中添加列配置信息；
21、将用户输入的原始数据进行处理，并渲染更新用户可视区域内的数据，完成数据展示。
22、优选的，所述全局配置替换的方法包括：修改配置和读取配置
23、所述修改配置的方法为：采用比较合并的方式将前后两次的配置转成字符串进行全等比较，若发现前后两次的配置有不同，则通过扩展运算符进行配置的合并，将老配置替换为新配置；
24、所述读取配置的方法为：读取指定配置或所有配置。
25、优选的，所述重叠展示的方法包括：
26、编写具有基本展示功能的所述基础表格，所述基础表格自身使用自定义滚动条实现表头固定；
27、之后使用3个所述基础表格重叠展示，分别展示非固定列、左固定列、右固定列，完成表格固定表头及固定列的展示效果。
28、优选的，所述添加列配置信息的方法包括：勾选列配置信息，通过组件的props将所述列配置信息发送到内部表格组件来判断否需要展示序号列、选择列及操作列的配置，若判断为需要，则在组件渲染之前向列配置中添加相关的所述列配置信息。
29、优选的，所述数据展示的方法包括：
30、将用户输入的所述原始数据进行处理得到数据项，判断用户界面中可视区域的尺寸和数据项大小，判断所述可视区域中的存在的待渲染数据项，并对所述待渲染数据项进行渲染，展示渲染后数据项；
31、当所述可视区域中的所述待渲染数据项发生变化更新时，移除并缓存不再可见的所述渲染后数据项，重新渲染更新后的所述待渲染数据项，并重现展示所述渲染后数据项。
32、与现有技术相比，本发明的有益效果为：
33、本发明在保留表格常用的序号列、选择列、列拖拽、排序等基础功能的前提下，分别封装一些常见的如链接、时间日期、操作列、枚举值、标签等单元格数据逻辑和单元格展示逻辑，能够满足大部分的使用场景。开发人员只需要关注传入的数据格式并使用正确的配置，即可迅速达到想要的展示效果，不仅可以提高工作效率，还可以降低维护成本。
1.一种基于react的表格扩展系统，其特征在于，包括：全局配置项封装模块、固定模块、列配置模块和数据展示模块；
2.根据权利要求1所述一种基于react的表格扩展系统，其特征在于，所述全局配置封装模块包括：修改配置单元和读取配置单元；
3.根据权利要求1所述一种基于react的表格扩展系统，其特征在于，所述固定模块的工作流程包括：
4.根据权利要求1所述一种基于react的表格扩展系统，其特征在于，所述列配置模块的工作流程包括：勾选列配置信息，通过组件的props将所述列配置信息发送到内部表格组件来判断否需要展示序号列、选择列及操作列的配置，若判断为需要，则在组件渲染之前向列配置中添加相关的所述列配置信息。
5.根据权利要求1所述一种基于react的表格扩展系统，其特征在于，所述数据展示模块的工作流程包括：
6.一种基于react的表格扩展方法，所述方法应用于权利要求1-5任一项所述的系统，其特征在于，包括以下步骤：
7.根据权利要求6所述一种基于react的表格扩展方法，其特征在于，所述全局配置替换的方法包括：修改配置和读取配置
8.根据权利要求6所述一种基于react的表格扩展方法，其特征在于，所述重叠展示的方法包括：
9.根据权利要求6所述一种基于react的表格扩展方法，其特征在于，所述添加列配置信息的方法包括：勾选列配置信息，通过组件的props将所述列配置信息发送到内部表格组件来判断否需要展示序号列、选择列及操作列的配置，若判断为需要，则在组件渲染之前向列配置中添加相关的所述列配置信息。
10.根据权利要求6所述一种基于react的表格扩展方法，其特征在于，所述数据展示的方法包括：
