CN115221852A - 基于vxe-table的动态计算表格实现方法、装置和计算机设备 - Google Patents

Abstract

本申请涉及一种基于vxe‑table的动态计算表格实现方法、装置和计算机设备。所述方法包括：获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。该表格计算功能的实现相对于现有技术比较简单，实现数据的联动计算不需要编写大量的代码，用户可以直接输入相应格式的数据计算公式即可。

Description

基于vxe-table的动态计算表格实现方法、装置和计算机设备

技术领域

本申请涉及计算机应用技术领域，特别是涉及一种基于vxe-table的动态计算表格实现方法、装置和计算机设备。

背景技术

随着计算机应用技术的发展，一般通过表格形式对数据进行展示。其中，Vxe-table是一个基于Vue的PC端表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、打印导出、表单渲染、数据分页、弹窗、自定义模板等功能。

但是Vxe-table的主要功能为数据的展示，目前仍有以下缺点：

1、没有开箱即用的数据计算功能，实现数据的联动计算需要开发人员编写大量的代码去实现。

2、编写好的表格不能重复使用，换一个使用场景就要重新编写计算方法。

3、数据计算能力面向开发人员，需要一点的编程基础才能完成表格计算式的定义，用户不能自定义表格的计算能力。

因此在现有技术中，为了实现基于vxe-table的PC端表格的数据计算能力，开发人员需要编写大量的代码；而且面对不同的使用场景，需要编写大量不同的代码实现不同的计算能力。因此现有的基于vxe-table的具有数据计算能力的PC端表格具有开发难度大的问题。

针对相关技术中存在基于vxe-table的具有数据计算能力的PC端表格具有开发难度大的问题，目前还没有提出有效的解决方案。

发明内容

基于此，有必要针对上述技术问题，提供一种能够降低开发难度的基于vxe-table的动态计算表格实现方法、装置、计算机设备、计算机可读存储介质和计算机程序产品。

第一方面，本申请提供了一种基于vxe-table的动态计算表格实现方法。所述方法包括：

获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

在其中一个实施例中，所述方法还包括：

当检测到所述数据表格中的数据值发生变化时，根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中变化后的数据值进行计算，并在所述数据表格中更新所述数据计算结果。

在其中一个实施例中，所述当检测到所述数据表格中的数据值发生变化时，根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中变化后的数据值进行计算包括：

基于vxe-table组件，根据用户输入的修改指令确定所述数据表格中待修改的数据值，将所述待修改的数据值所在的单元格转换为数据输入框；

在所述数据输入框中接收新的数据值，通过所述新的数据值替换所述待修改的数据值；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算。

在其中一个实施例中，所述方法还包括：

当检测到所述数据计算公式发生变化时，根据所述第一对应关系和所述第二对应关系，通过变化后的数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中更新所述数据计算结果。

在其中一个实施例中，所述根据预设的表格生成规则，基于所述数据名和数据值生成数据表格包括：

根据所述数据名渲染生成所述数据表格的表头，根据所述数据值渲染生成所述数据表格的表身。

在其中一个实施例中，所述根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值包括：

根据所述第一对应关系和所述第二对应关系，确定所述数据值与所述数据计算公式中的自变量的映射关系；

根据所述映射关系，将所述数据计算公式和所述表格中的相应的数据值输入预设的计算库中；其中，所述计算库用于根据所述映射关系将所述数据值带入所述数据计算公式中进行计算，并生成数据计算结果；

从所述计算库中获取所述数据计算结果，并在所述数据表格中渲染所述数据计算结果。

在其中一个实施例中，所述方法还包括：

根据所述数据计算公式的运行结果，判断所述数据计算公式是否异常；

若是，则提示所述数据计算公式错误；

若否，则存储所述数据计算公式。

第二方面，本申请还提供了一种基于vxe-table的动态计算表格实现装置。

所述装置包括：

数据获取模块，用于获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

表格生成模块，用于根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

公式获取模块，用于获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

数据计算模块，用于根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

第三方面，本申请还提供了一种计算机设备。所述计算机设备包括存储器和处理器，所述存储器存储有计算机程序，所述处理器执行所述计算机程序时实现以下步骤：

获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

第四方面，本申请还提供了一种计算机可读存储介质。所述计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现以下步骤：

获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

第五方面，本申请还提供了一种计算机程序产品。所述计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现以下步骤：

获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

上述基于vxe-table的动态计算表格实现方法、装置、计算机设备和计算机可读存储介质，终端设备首先获取待渲染的数据，并根据数据中的数据值和数据值自动生成相应的表格；然后接收由用户输入的数据计算公式，而数据计算公式中的自变量与数据名、数据值对应，从而在计算时直接根据对应关系将数据值带入数据计算公式中计算即可。该表格计算功能的实现相对于现有技术比较简单，实现数据的联动计算不需要编写大量的代码，用户可以直接输入相应格式的数据计算公式即可；在不同的应用场景下，用户也只需要根据实际情况设计不同的数据计算公式，因此通过该方法实现的表格具有开发难度小的优点。

附图说明

图1是本实施例中的基于vxe-table的动态计算表格实现方法的流程图；

图2是本优选实施例中的基于vxe-table的动态计算表格实现方法的流程图；

图3是本优选实施例中的基于vxe-table的动态计算表格实现方法的优选流程图；

图4是本实施例中的基于vxe-table的动态计算表格实现装置的结构框图；

图5是一个实施例中计算机设备的内部结构图。

具体实施方式

为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行进一步详细说明。应当理解，此处描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。

图1是本实施例中的基于vxe-table的动态计算表格实现方法的流程图。本实施例以该方法应用于具有显示装置的终端进行举例说明，可以理解的是，该方法还可以应用于包括终端和服务器的***，并通过终端和服务器的交互实现。如图1所示，上述流程包括以下步骤：

步骤S110，获取待渲染的数据，其中待渲染的数据包括数据名和数据值，数据名和数据值之间具有第一对应关系；

具体的，终端设备获取待渲染的数据，其中数据由具有第一对应关系的数据名和数据值构成，数据名即为数据结构中的字段名，其为数据值的标识信息；比如数据名A与数据值6具有第一对应关系，则数据名A是在数据结构中是数据值6的标识。进一步的，一个数据名可以对应着多个数据值。

步骤S120，根据预设的表格生成规则，基于数据名和数据值生成数据表格。

具体的，终端设备获取到数据后，根据数据中的数据名和数据值自动生成表格。其中具体的，预设的表格生成规则为终端设备根据数据名渲染生成数据表格的表头，并根据数据值渲染生成数据表格的表身；示例性地，当数据中包括5个数据名时，则根据这些数据名至少生成5个表头格，每个表头格下方则对应着一列单元格，每一列单元格中按照顺序渲染与表头中数据名对应的数据值，从而终端设备根据数据名和数据值自动生成表格。相比于现有技术中用户先制作表格或是先确定表格模板，然后再将数据填入表格中的表格构建方式；本实施例中，设备终端直接基于已获取的数据，并根据相应的数据结构渲染生成相应的表格，从而大大提高了表格生成效率，最终在显示装置上展示相应的数据。

步骤S130，获取预设的数据计算公式，其中数据计算公式中的自变量和数据名之间具有第二对应关系。

具体的，终端设备获取用户输入的数据计算公式，其中数据计算公式中的各个自变量分别与多个数据名对应。示例性地，当多个数据名分别为A、B、C时，数据计算公式可以为X＝3A+2B+A+a，其中X为结果项，a为常数项。需要特别说明的是，多个数据计算公式可以由用户提前输入至终端设备中进行保存，并在使用时在表格中选择相应的数据计算公式。优选的，在表格的配置界面上提供数据计算公式的输入控件和已生效公式展示区；用户在输入控件中输入数据计算公式后，数据计算公式显示在展示区，展示区可对已生效公式做删除操作，进而终端设备可以实时接收用户输入的数据计算公式。

步骤S140，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值。

具体的，终端设备根据第一对应关系和第二对应关系将数据值与数据计算公式中的自变量进行关联映射。在数据计算的过程中，根据映射关系直接将数据值带入数据计算公式中进行计算，从而得到数据计算结果，最后在数据表格中渲染相应的数据计算结果。进一步具体的，数据表格中的每一行数据值为一组，一组数据值中的多个数据值分别与数据计算公式的多个自变量对应，计算时将数据值带入相应的自变量中实现计算。

上述基于vxe-table的动态计算表格实现方法中，终端设备首先获取待渲染的数据，并根据数据中的数据值和数据值自动生成相应的表格；然后接收由用户输入的数据计算公式，而数据计算公式中的自变量与数据名、数据值对应，从而在计算时直接根据对应关系将数据值带入数据计算公式中计算即可。该表格计算功能的实现相对于现有技术比较简单，实现数据的联动计算不需要编写大量的代码，用户可以直接输入相应格式的数据计算公式即可；在不同的应用场景下，用户也只需要根据实际情况设计不同的数据计算公式，因此通过该方法实现的表格具有开发难度小的优点。需要特别说明的是，本实施例中使用的数据计算公式需要满足特定的格式条件，即数据计算公式中的自变量需要与数据名对应，因此用户可以直接将数据名作为自变量设计相应的数据计算公式。

需要进一步说明的是，本实施例中的方法只根据数据最基本的字段名和字段值来生成表格，不限制字段类型。不需要采用特定专业的数据格式，通用的键值对数据都可以生成表格。而且数据计算公式由单独的输入模块输入，和数据分离，表格生成前后都可以自由修改。

在其中一个实施例中，基于vxe-table的动态计算表格实现方法还包括如下步骤：

当检测到数据表格中的数据值发生变化时，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中变化后的数据值进行计算，并在数据表格中更新数据计算结果。

具体的，通过本实施例中的方法生成的表格还具有动态计算的功能，即生成表格且根据数据计算公式完成结果渲染之后，还可以根据表格中的数据变动实时重新计算结果。进一步具体的，在检测到表格中的数据变动后，将相应的数据值组带入到数据计算公式重新进行计算，比如检测到第三行中某个数据值变动后，则将第三行中的数据值带入公式再计算，并在表格中更新数据计算结果。

进一步的，在一个具体的实施例中，基于vxe-table的动态计算表格实现方法还包括如下步骤：

基于vxe-table组件，根据用户输入的修改指令确定数据表格中待修改的数据值，将待修改的数据值所在的单元格转换为数据输入框；

在数据输入框中接收新的数据值，通过新的数据值替换待修改的数据值；

根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算。

具体的，本实施例中的表格修改功能由vxe-table组件提供。示例性地，当用户需要对表格中某个数据值进行修改时，通过鼠标点击相应的数据值，则该数据值所在的单元格转换为数据输入框，此时用户可以在数据输入框中输入新的数据值，终端设备在接收新的数据值后替换原有的数据值，因此新的数据值与数据名之间的保持原有的第一对应关系。当完成数据值替换之后，设备终端则检测出一次数据值变动已经完成，进而将新的数据值所在行的所有数据值带入数据计算公式中重新进行计算。因此在本实施例中，根据vxe-table组件提供的修改功能，用户可以实时修改表格中的数据值，而设备终端则根据数据值变化实时重新计算并在表格中更新数据计算结果，从而该表格实现了动态计算功能。

在另一个实施例中，基于vxe-table的动态计算表格实现方法还包括如下步骤：

当检测到数据计算公式发生变化时，根据第一对应关系和第二对应关系，通过变化后的数据计算公式对数据表格中的数据值进行计算，并在数据表格中更新数据计算结果。

具体的，通过该方法实现的表格还具有修改数据计算公式的功能。设备终端设备在接收到新的数据计算公式后，将表格中的数据值按照对应关系重新带入新的数据计算公式中进行计算，并更新所有的数据计算结果。因此用户可以根据实际地使用情况，设计新的数据计算公式。示例性地，表格的配置界面上提供数据计算公式的输入控件和已生效公式展示区；用户在输入控件中输入数据计算公式后，数据计算公式显示在展示区，展示区可对已生效公式做删除操作，同时用户可以直接在输入控件上修改数据计算公式或是输入新的数据计算公式。

在其中的一个实施例中，步骤根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值包括：

根据第一对应关系和第二对应关系，确定数据值与数据计算公式中的自变量的映射关系；

根据映射关系，将数据计算公式和表格中的相应的数据值输入预设的计算库中；其中，计算库用于根据映射关系将数据值带入数据计算公式中进行计算，并生成数据计算结果；

从计算库中获取数据计算结果，并在数据表格中渲染数据计算结果。

具体的，终端设备首先根据数据名与数据值间的第一对应关系、数据名与自变量间的第二对应关系确定数据值与自变量的映射关系，然后根据该映射关系将数据计算公式和相应的数据值输入至计算库中，然后通过该数据库实现数据值的计算，最终从数据库中获取数据计算结果。其中具体的，数据库在计算时根据映射关系，将各个数据值带入数据计算公式的自变量中实现计算。示例性地，计算库采用专业计算库math.js，通过该计算库中的evaluate方法实现数据计算。

在其中一个可选的实施例中，基于vxe-table的动态计算表格实现方法还包括如下步骤：

根据数据计算公式的运行结果，判断数据计算公式是否异常；

若是，则提示数据计算公式错误；若否，则存储数据计算公式。

具体的，在本实施例中的动态计算表格实现方法还包括错误捕获功能，根据数据计算公式的运行结果进行判断，如果运行出错进行会捕获错误，并用弹框的形式提示；如果运行正确则保存该数据计算公式，并通过其实现数据计算。

下面通过具体的优选实施例，对本申请中的技术方案作进一步的说明。

图2是本优选实施例中的基于vxe-table的动态计算表格实现方法的流程图。如图2所示，上述流程包括以下步骤：

步骤S210，在配置区接收计算公式。

具体的，配置区有两部分组成，一个是输入框，用以输入计算公式；另一个是公式展示区，展示已存在的公式，也可以选中公式进行删除操作，其中输入框由公式输入控件提供，因此用户可以在配置区的输入框中输入计算公式。

步骤S220，将计算公式存入计算队列并在公式展示区显示。

具体的，设备终端将计算公式保存至计算队列中，并在公式展示区进行显示。

步骤S230，判断计算公式是否异常；若是，则执行步骤S210，若否，则执行步骤S240。

具体的，在计算公式异常时提示错误，并重新接收新的计算公式；在计算公式无异常时执行步骤S240。

步骤S240，遍历表格数据，将每行数据填入计算公式中进行计算，并把结果存入表格数据中。

步骤S250，将计算后的表格数据渲染到表格中。

图3是本优选实施例中的基于vxe-table的动态计算表格实现方法的优选流程图。如图3所示，上述优选流程包括如下步骤：

步骤S310，接收由用户输入的计算公式。

具体的，利用vue的双向绑定功能，将用户输入的计算公式赋值给过渡变量。

步骤S320，储存计算公式：将过渡变量的值存入计算公式数组，并清空过渡变量。

步骤S330，根据计算公式计算表格中的数据。

具体的，用户输入新的计算公式后，点击表格上方的计算按钮调用计算函数，函数执行操作遍历表格数据，将每一行表格数据和计算公式输入一起输入mathJS的evaluate方法中，都出计算结果。

步骤S340，根据表格中的数据变动重新计算表格中的数据。

具体的，利用vxe-table的表格编辑功能，用户点击表格数据项之后单元格变为输入框，输入框动态绑定对应的表格数据，用户输入数据后回车或者点击单元格之外的地方触发计算函数，重新计算表格数据。

通过上述优选流程可知，本申请中提供了一种基于vue+vxe-table的可自定义计算公式的动态计算表格实现方法。方该法包括下述步骤：在配置界面上提供计算公式输入控件和已生效公式展示区；在输入控件中输入计算公式后，公式显示在展示区，展示区可对已生效公式做删除操作；在表格控件中提供输入控件，用户点击表格中数据后显示输入控件，待用户输入新的数据后，根据计算公式，将计算结果动态渲染到表格中。通过本方法提高表格的可复用性，提高研发人员的开发效率，同时使数据录入工作更加简单、高效。

通过上述优选实施例的说明，本申请中的基于vxe-table的动态计算表格实现方法至少具有如下优点：

1、开发人员无需编写大量代码实现表格的联动计算功能，提升开发效率

2、表格定义完成可重复使用，面对不同的计算场景只需要改变计算公式即可，减少重复劳动

3、不只是面向开发人员，用户也可以定义计算公式，操作更加灵活。

应该理解的是，虽然如上的各实施例所涉及的流程图中的各个步骤按照箭头的指示依次显示，但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明，这些步骤的执行并没有严格的顺序限制，这些步骤可以以其它的顺序执行。而且，如上的各实施例所涉及的流程图中的至少一部分步骤可以包括多个步骤或者多个阶段，这些步骤或者阶段并不必然是在同一时刻执行完成，而是可以在不同的时刻执行，这些步骤或者阶段的执行顺序也不必然是依次进行，而是可以与其它步骤或者其它步骤中的步骤或者阶段的至少一部分轮流或者交替地执行。

基于同样的发明构思，本申请实施例还提供了一种用于实现上述所涉及的基于vxe-table的动态计算表格实现方法的基于vxe-table的动态计算表格实现装置。该装置所提供的解决问题的实现方案与上述方法中所记载的实现方案相似，故下面所提供的一个或多个基于vxe-table的动态计算表格实现装置实施例中的具体限定可以参见上文中对于基于vxe-table的动态计算表格实现方法的限定，在此不再赘述。

图4是本实施例中的基于vxe-table的动态计算表格实现装置的结构框图。在一个实施例中，如图4所示，提供了一种基于vxe-table的动态计算表格实现装置，该装置包括：数据获取模块410、表格生成模块420、公式获取模块430和数据计算模块440，其中：

数据获取模块410，用于获取待渲染的数据，其中待渲染的数据包括数据名和数据值，数据名和数据值之间具有第一对应关系；

表格生成模块420，用于根据预设的表格生成规则，基于数据名和数据值生成数据表格；

公式获取模块430，用于获取预设的数据计算公式，其中数据计算公式中的自变量和数据名之间具有第二对应关系；

数据计算模块440，用于根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值。

通过上述模块实现了一种基于vxe-table的动态计算表格，该表格计算功能的实现相对于现有技术比较简单，实现数据的联动计算不需要编写大量的代码，用户可以直接输入相应格式的数据计算公式即可；在不同的应用场景下，用户也只需要根据实际情况设计不同的数据计算公式，因此通过该方法实现的表格具有开发难度小的优点。

在其他的实施例中，基于vxe-table的动态计算表格实现装置还包括：第一更新模块、第二更新模块和公式判断模块；其中：

第一更新模块，用于当检测到数据表格中的数据值发生变化时，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中变化后的数据值进行计算，并在数据表格中更新数据计算结果；

第二更新模块，用于当检测到数据计算公式发生变化时，根据第一对应关系和第二对应关系，通过变化后的数据计算公式对数据表格中的数据值进行计算，并在数据表格中更新数据计算结果；

公式判断模块，用于根据数据计算公式的运行结果，判断数据计算公式是否异常；若是，则提示数据计算公式错误；若否，则存储数据计算公式。

上述基于vxe-table的动态计算表格实现装置中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中，也可以以软件形式存储于计算机设备中的存储器中，以便于处理器调用执行以上各个模块对应的操作。

在一个实施例中，提供了一种计算机设备，该计算机设备可以是终端，其内部结构图可以如图5所示。该计算机设备包括通过***总线连接的处理器、存储器、通信接口、显示屏和输入装置。其中，该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作***和计算机程序。该内存储器为非易失性存储介质中的操作***和计算机程序的运行提供环境。该计算机设备的通信接口用于与外部的终端进行有线或无线方式的通信，无线方式可通过WIFI、移动蜂窝网络、NFC(近场通信)或其他技术实现。该计算机程序被处理器执行时以实现一种基于vxe-table的动态计算表格实现方法。该计算机设备的显示屏可以是液晶显示屏或者电子墨水显示屏，该计算机设备的输入装置可以是显示屏上覆盖的触摸层，也可以是计算机设备外壳上设置的按键、轨迹球或触控板，还可以是外接的键盘、触控板或鼠标等。

本领域技术人员可以理解，图5中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的计算机设备的限定，具体的计算机设备可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。

在一个实施例中，提供了一种计算机设备，包括存储器和处理器，存储器中存储有计算机程序，该处理器执行计算机程序时实现以下步骤：

步骤A1，获取待渲染的数据，其中待渲染的数据包括数据名和数据值，数据名和数据值之间具有第一对应关系；

步骤A2，根据预设的表格生成规则，基于数据名和数据值生成数据表格；

步骤A3，获取预设的数据计算公式，其中数据计算公式中的自变量和数据名之间具有第二对应关系；

步骤A4，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值。

在一个实施例中，提供了一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以下步骤：

步骤B1，获取待渲染的数据，其中待渲染的数据包括数据名和数据值，数据名和数据值之间具有第一对应关系；

步骤B2，根据预设的表格生成规则，基于数据名和数据值生成数据表格；

步骤B3，获取预设的数据计算公式，其中数据计算公式中的自变量和数据名之间具有第二对应关系；

步骤B4，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值。

在一个实施例中，提供了一种计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现以下步骤：

步骤C1，获取待渲染的数据，其中待渲染的数据包括数据名和数据值，数据名和数据值之间具有第一对应关系；

步骤C2，根据预设的表格生成规则，基于数据名和数据值生成数据表格；

步骤C3，获取预设的数据计算公式，其中数据计算公式中的自变量和数据名之间具有第二对应关系；

步骤C4，根据第一对应关系和第二对应关系，通过数据计算公式对数据表格中的数据值进行计算，并在数据表格中渲染数据计算结果值。

需要说明的是，本申请所涉及的用户信息(包括但不限于用户设备信息、用户个人信息等)和数据(包括但不限于用于分析的数据、存储的数据、展示的数据等)，均为经用户授权或者经过各方充分授权的信息和数据。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，的计算机程序可存储于一非易失性计算机可读取存储介质中，该计算机程序在执行时，可包括如上述各方法的实施例的流程。其中，本申请所提供的各实施例中所使用的对存储器、数据库或其它介质的任何引用，均可包括非易失性和易失性存储器中的至少一种。非易失性存储器可包括只读存储器(Read-OnlyMemory，ROM)、磁带、软盘、闪存、光存储器、高密度嵌入式非易失性存储器、阻变存储器(ReRAM)、磁变存储器(Magnetoresistive Random Access Memory，MRAM)、铁电存储器(Ferroelectric Random Access Memory，FRAM)、相变存储器(Phase Change Memory，PCM)、石墨烯存储器等。易失性存储器可包括随机存取存储器(Random Access Memory，RAM)或外部高速缓冲存储器等。作为说明而非局限，RAM可以是多种形式，比如静态随机存取存储器(Static Random Access Memory，SRAM)或动态随机存取存储器(Dynamic RandomAccess Memory，DRAM)等。本申请所提供的各实施例中所涉及的数据库可包括关系型数据库和非关系型数据库中至少一种。非关系型数据库可包括基于区块链的分布式数据库等，不限于此。本申请所提供的各实施例中所涉及的处理器可为通用处理器、中央处理器、图形处理器、数字信号处理器、可编程逻辑器、基于量子计算的数据处理逻辑器等，不限于此。

以上实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。

以上实施例仅表达了本申请的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本申请专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本申请构思的前提下，还可以做出若干变形和改进，这些都属于本申请的保护范围。因此，本申请的保护范围应以所附权利要求为准。

Claims (10)

1.一种基于vxe-table的动态计算表格实现方法，其特征在于，所述方法包括：

获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

2.根据权利要求1所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述方法还包括：

当检测到所述数据表格中的数据值发生变化时，根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中变化后的数据值进行计算，并在所述数据表格中更新所述数据计算结果。

3.根据权利要求2所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述当检测到所述数据表格中的数据值发生变化时，根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中变化后的数据值进行计算包括：

基于vxe-table组件，根据用户输入的修改指令确定所述数据表格中待修改的数据值，将所述待修改的数据值所在的单元格转换为数据输入框；

在所述数据输入框中接收新的数据值，通过所述新的数据值替换所述待修改的数据值；

根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算。

4.根据权利要求1所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述方法还包括：

当检测到所述数据计算公式发生变化时，根据所述第一对应关系和所述第二对应关系，通过变化后的数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中更新所述数据计算结果。

5.根据权利要求1至权利要求4中任一项所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述根据预设的表格生成规则，基于所述数据名和数据值生成数据表格包括：

根据所述数据名渲染生成所述数据表格的表头，根据所述数据值渲染生成所述数据表格的表身。

6.根据权利要求1至权利要求4中任一项所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值包括：

根据所述第一对应关系和所述第二对应关系，确定所述数据值与所述数据计算公式中的自变量的映射关系；

根据所述映射关系，将所述数据计算公式和所述表格中的相应的数据值输入预设的计算库中；其中，所述计算库用于根据所述映射关系将所述数据值带入所述数据计算公式中进行计算，并生成数据计算结果；

从所述计算库中获取所述数据计算结果，并在所述数据表格中渲染所述数据计算结果。

7.根据权利要求1至权利要求4中任一项所述的基于vxe-table的动态计算表格实现方法，其特征在于，所述方法还包括：

根据所述数据计算公式的运行结果，判断所述数据计算公式是否异常；

若是，则提示所述数据计算公式错误；

若否，则存储所述数据计算公式。

8.一种基于vxe-table的动态计算表格实现装置，其特征在于，所述装置包括：

数据获取模块，用于获取待渲染的数据，其中所述待渲染的数据包括数据名和数据值，所述数据名和所述数据值之间具有第一对应关系；

表格生成模块，用于根据预设的表格生成规则，基于所述数据名和数据值生成数据表格；

公式获取模块，用于获取预设的数据计算公式，其中所述数据计算公式中的自变量和所述数据名之间具有第二对应关系；

数据计算模块，用于根据所述第一对应关系和所述第二对应关系，通过所述数据计算公式对所述数据表格中的数据值进行计算，并在所述数据表格中渲染数据计算结果值。

9.一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，其特征在于，所述处理器执行所述计算机程序时实现权利要求1至权利要求7中任一项所述的方法的步骤。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1至权利要求7中任一项所述的方法的步骤。

Images