本申请涉及web前端，尤其涉及一种基于vue的路由参数表格数据查询方法、设备及存储介质。
背景技术：
：：1、在传统的web应用程序中，前端代码逻辑通常与用户录入数据、表格页码和每页显示条数等参数绑定在一起，以构建api接口参数并查询数据。这种方法在用户点击查询按钮、表格翻页或修改每页条数时需要重新构建api接口参数，并调用api接口查询数据，这种方法的缺点是相同的逻辑代码被重复使用，造成了代码冗余；且用户需要通过重新在系统内执行跳转页面操作以重新录入数据，操作复杂的同时占用时间长。技术实现思路1、本申请实施例提供了一种基于vue的表格数据查询方法、设备及存储介质，解决了web应用程序中前端应用代码冗余以及用户操作复杂的同时占用时间长的技术问题。2、第一方面，本申请实施例提供了一种基于vue的表格数据查询方法，方法具体包括：3、基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数；其中，路由参数的状态包括：路由参数存在、路由参数不存在；通过对应的api接口传递接口参数，得到接口参数数据；基于接口参数数据绑定table表格；其中table表格用于表示待查询数据；根据接口参数对应的当前的路由参数，展示对应的当前的table表格。4、在本申请的一种实现方式中，构建对应的接口参数，具体包括：在路由参数的状态为路由参数存在的情况下，基于路由参数，通过预设的路由参数传递规则构建对应的接口参数；在路由参数的状态为路由参数不存在的情况下，基于预设的默认路由参数，通过预设的路由参数传递规则构建对应的接口参数。5、在本申请的一种实现方式中，在基于接口参数数据绑定table表格之后，方法还包括：基于table表格设置预览条件，得到预览条件数据；其中，预览条件包括页码、每页条数；处理预览条件数据，得到预览路由参数；将预览路由参数跳转，并添加至基于渲染的生命周期钩子中；基于添加了预览路由参数的生命周期钩子，绑定并更新table表格。6、在本申请的一种实现方式中，在路由参数的状态为路由参数存在的情况下，基于路由参数，通过预设的路由参数传递规则构建对应的接口参数之后，方法还包括：基于接口参数，录入并绑定关键词数据；其中，关键词数据用于查询包含关键词数据种类的table表格；处理关键词数据，得到关键词路由参数；将关键词路由参数跳转，并添加至基于渲染的生命周期钩子中；基于添加了关键词路由参数的生命周期钩子，绑定并更新table表格。7、在本申请的一种实现方式中，在基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数之前，方法还包括：将功能路由跳转，并添加至基于渲染的生命周期钩子中；基于添加了功能路由参数的生命周期钩子，绑定并更新table表格。8、在本申请的一种实现方式中，将预览路由参数跳转，具体包括：根据预览路由参数，确定对应的预览路由函数，其中预览路由函数为路由replace函数；通过预览路由函数，跳转并携带预览路由参数。9、在本申请的一种实现方式中，将关键词路由参数跳转，具体包括：根据关键词路由参数，确定对应的关检测路由函数，其中关键词路由函数为路由replace函数；通过关键词路由函数，跳转并携带关键词路由参数。10、在本申请的一种实现方式中，将功能路由参数跳转，具体包括：根据功能路由参数，确定对应的功能路由函数，其中功能路由函数为push函数；通过功能路由函数，跳转并携带功能路由参数。11、第二方面，本申请实施例还提供了一种基于vue的表格数据查询设备，其特征在于，设备包括：12、至少一个处理器；13、以及，与至少一个处理器通信连接的存储器；14、其中，存储器存储有可被至少一个处理器执行的指令，指令被至少一个处理器执行，以使至少一个处理器能够：15、基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数；其中，路由参数的状态包括：路由参数存在、路由参数不存在；通过对应的api接口传递接口参数，得到接口参数数据；基于接口参数数据绑定table表格；其中table表格用于表示待查询数据；根据接口参数对应的当前的路由参数，展示对应的当前的table表格。16、第三方面，本申请实施例还提供了一种基于vue的表格数据查询方法的非易失性计算机存储介质，存储有计算机可执行指令，其特征在于，计算机可执行指令设置为：17、基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数；其中，路由参数的状态包括：路由参数存在、路由参数不存在；通过对应的api接口传递接口参数，得到接口参数数据；基于接口参数数据绑定table表格；其中table表格用于表示待查询数据；根据接口参数对应的当前的路由参数，展示对应的当前的table表格。18、本申请实施例提供了一种基于vue的表格数据查询方法、设备及存储介质，通过构建路由参数的更新逻辑，解决了web应用程序中前端应用代码冗余以及用户操作复杂的同时占用时间长的技术问题，具有精简了前端的代码逻辑、减少了用户的操作步骤、简化了用户的操作流程，进而更贴合用户业务需求的优点。技术特征：1.一种基于vue的表格数据查询方法，其特征在于，所述方法包括：2.根据权利要求1所述的一种基于vue的表格数据查询方法，其特征在于，所述构建对应的接口参数，具体包括：3.根据权利要求1所述的一种基于vue的表格数据查询方法，其特征在于，在基于所述接口参数数据绑定table表格之后，所述方法还包括：4.根据权利要求2所述的一种基于vue的表格数据查询方法，其特征在于，在所述路由参数的状态为路由参数存在的情况下，基于所述路由参数，通过预设的路由参数传递规则构建对应的接口参数之后，所述方法还包括：5.根据权利要求1所述的一种基于vue的表格数据查询方法，其特征在于，在基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数之前，所述方法还包括：6.根据权利要求3所述的一种基于vue的表格数据查询方法，其特征在于，将所述预览路由参数跳转，具体包括：7.根据权利要求4所述的一种基于vue的表格数据查询方法，其特征在于，将所述关键词路由参数跳转，具体包括：8.根据权利要求5所述的一种基于vue的表格数据查询方法，其特征在于，将所述功能路由参数跳转，具体包括：9.一种基于vue的表格数据查询设备，其特征在于，所述设备包括：10.一种基于vue的表格数据查询方法的非易失性计算机存储介质，存储有计算机可执行指令，其特征在于，所述计算机可执行指令设置为：技术总结本申请公开了一种基于Vue的表格数据查询方法、设备及存储介质，用以解决解决了Web应用程序中前端应用代码冗余以及用户操作复杂的同时占用时间长的技术问题。方法包括：基于渲染的生命周期钩子中路由参数的状态，构建对应的接口参数；其中，路由参数的状态包括：路由参数存在、路由参数不存在；通过对应的api接口传递接口参数，得到接口参数数据；基于接口参数数据绑定table表格；其中table表格用于表示待查询数据；根据接口参数对应的当前的路由参数，展示对应的当前的table表格。本申请通过上述方法实现了精简前端的代码逻辑、减少用户的操作步骤、简化用户的操作流程。技术研发人员：王敏受保护的技术使用者：山东浪潮爱购云链信息科技有限公司技术研发日：技术公布日：2024/3/27