前端路由生成方法、装置、电子设备及存储介质制造方法及图纸

本申请涉及人工智能，提供一种前端路由生成方法、装置、电子设备及存储介质。该方法通过页面获取页面配置信息，并解析所述菜单的配置信息及所述前端路由配置信息。其中，所述页面配置信息包括：菜单的配置信息及所述菜单的前端路由配置信息，解析所述菜单的配置信息及所述前端路由配置信息。该方法还根据解析后的所述菜单的配置信息生成包括所述菜单的菜单面板，及根据解析后的所述前端路由配置信息生成所述菜单的前端路由。本申请还涉及区块链技术，生成的前端路由可存储于区块链中。生成的前端路由可存储于区块链中。生成的前端路由可存储于区块链中。

【技术实现步骤摘要】
前端路由生成方法、装置、电子设备及存储介质


[0001]本申请涉及Web前端
，尤其涉及一种前端路由生成方法、装置、电子设备及存储介质。

技术介绍

[0002]近几年，前端技术的发展和迭代速度越来越快，路由配置是前端技术开发中重要的一步骤，尤其是对于中大型应用项目而言，高度自定义配置路由显得尤为重要。然而，目前在配置前端路由时，通常由开发人员手动进行配置，为每一个页面编写相应的配置前端路由代码，当需要配置的前端路由较多时，代码的数量会相应增多，因此需消耗大量人工去手动配置前端路由。此外使用代码直接配置前端路由存在错误难以定位的问题，尤其在配置多页面的前端路由的情况下，一旦发生错误，无法精准定位到出现错误的地方，需要花费大量人力去查找出错误。

技术实现思路

[0003]鉴于以上内容，有必要提供一种前端路由生成方法、装置、电子设备及存储介质，以解决手动配置前端路由的技术问题。
[0004]一方面，本申请提出一种前端路由生成方法，所述方法包括：
[0005]通过页面获取页面配置信息，其中，所述页面配置信息包括：菜单的配置信息及所述菜单的前端路由配置信息；
[0006]解析所述菜单的配置信息及所述前端路由配置信息；
[0007]根据解析后的所述菜单的配置信息生成菜单面板，其中所述菜单面板包括所述菜单；
[0008]根据解析后的所述前端路由配置信息生成所述菜单的前端路由。
[0009]根据本申请优选实施例，所述通过页面获取页面配置信息包括：
[0010]提供页面配置信息输入面板，接收用户在所述页面配置信息输入面板输入的所述菜单的配置信息及所述菜单的前端路由配置信息；
[0011]将所述菜单的配置信息及所述菜单的前端路由配置信息通过第一接口返回给后端；及
[0012]通过第二接口从所述后端获取所述菜单的配置信息及所述菜单的前端路由配置信息。
[0013]根据本申请优选实施例，所述解析所述菜单的配置信息及所述前端路由配置信息包括：
[0014]预先定义全局路由钩子函数，并利用所述全局路由钩子函数对所述菜单的配置信息及所述前端路由配置信息进行解析。
[0015]根据本申请优选实施例，所述利用所述全局路由钩子函数对所述菜单的配置信息及所述前端路由配置信息进行解析包括：
[0016]将vue
‑
router插件的beforeEach钩子函数作为所述全局路由钩子函数；
[0017]在路由文件中添加所述vue
‑
router插件的beforeEach钩子函数；
[0018]通过所述beforeEach钩子函数调用后端的第二接口解析出所述菜单的配置信息及所述前端路由配置信息。
[0019]根据本申请优选实施例，所述根据解析后的前端路由配置信息生成所述菜单的前端路由包括：
[0020]将解析后的前端路由配置信息输入vue
‑
router插件的addRoute钩子函数中生成路由对象；
[0021]通过addRoute钩子函数将路由添加至所述路由对象，生成所述菜单的前端路由。
[0022]根据本申请优选实施例，所述方法还包括：
[0023]响应用户操作所述菜单的操作，根据所述菜单的前端路由生成所述菜单的页面。
[0024]根据本申请优选实施例，所述响应用户操作所述菜单的操作，根据所述菜单的前端路由生成所述菜单的页面，包括：
[0025]响应用户点击所述菜单的操作，触发vue
‑
router插件的beforeEach钩子函数渲染所述前端路由所对应的页面，生成所述菜单的页面。
[0026]另一方面，本申请还提出一种前端路由生成装置，所述装置包括：
[0027]获取单元，用于通过页面获取页面配置信息，其中，所述页面配置信息包括：菜单的配置信息及所述菜单的前端路由配置信息；
[0028]解析单元，用于解析所述菜单的配置信息及所述前端路由配置信息；
[0029]面板生成单元，用于根据解析后的所述菜单的配置信息生成菜单面板，其中所述菜单面板包括所述菜单；
[0030]路由生成单元，用于根据解析后的所述前端路由配置信息生成所述菜单的前端路由。
[0031]另一方面，本申请还提出一种电子设备，所述电子设备包括：
[0032]存储器，存储有计算机可读指令；及
[0033]处理器，执行所述存储器中存储的计算机可读指令以实现所述前端路由生成方法。
[0034]另一方面，本申请还提出一种计算机可读存储介质，所述计算机可读存储介质中存储有计算机可读指令，所述计算机可读指令被电子设备中的处理器执行以实现所述前端路由生成方法。
[0035]本申请通过页面配置信息输入面板获取页面配置信息，可以可视化的查看页面的配置信息，减少页面配置信息错误的发生。本申请通过解析所述菜单配置信息及所述前端路由配置信息，根据解析后的菜单配置信息生成菜单面板，根据解析后的前端路由配置信息生成所述菜单面板的前端路由，并根据所述菜单面板及所述菜单面板的前端路由生成页面，从而达到可视化配置需要生成页面的前端路由，避免开发人员撰写大量的代码生成前端路由，从而减少人力成本。本申请还生成所述菜单的页面供用户查看，用户通过查看对应菜单的页面确定前端路由中出现的错误，解决了现有方案中使用代码直接配置前端路由而难以定位前端路由的错误的问题，进一步节约了配置前端路由的人力成本。
附图说明
[0036]图1是本申请前端路由生成方法的较佳实施例的流程图。
[0037]图2是本申请前端路由生成方法的较佳实施例的页面配置信息输入面板的示意图。
[0038]图3是本申请前端路由生成装置的较佳实施例的功能模块图。
[0039]图4是本申请实现前端路由生成方法的较佳实施例的电子设备的结构示意图。
具体实施方式
[0040]为了使本申请的目的、技术方案和优点更加清楚，下面结合附图和具体实施例对本申请进行详细描述。
[0041]如图1所示，是本申请前端路由生成方法的较佳实施例的流程图。根据不同的需求，该流程图中步骤的顺序可以改变，某些步骤可以省略。
[0042]所述前端路由生成方法可以基于人工智能技术对相关的数据进行获取和处理。其中，人工智能(Artificial Intelligence，AI)是利用数字计算机或者数字计算机控制的机器模拟、延伸和扩展人的智能，感知环境、获取知识并使用知识获得最佳结果的理论、方法、技术及应用系统。
[0043]人工智能基础技术一般包括如传感器、专用人工智能芯片、云计算、分布式存储、大数据处理技术、操作/交互系统、机电一体化等技术。人工智能软件技术主要包括计算机视觉技术、机器人技术、生物识别技术、语音处理技术、自然语言处理技术以及机器学习/深度学习等几大方向。
[0044]所述前端路由生成方法应用于一个或者多本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种前端路由生成方法，其特征在于，所述方法包括：通过页面获取页面配置信息，其中，所述页面配置信息包括：菜单的配置信息及所述菜单的前端路由配置信息；解析所述菜单的配置信息及所述前端路由配置信息；根据解析后的所述菜单的配置信息生成菜单面板，其中所述菜单面板包括所述菜单；根据解析后的所述前端路由配置信息生成所述菜单的前端路由。2.根据权利要求1所述的前端路由生成方法，其特征在于，所述通过页面获取页面配置信息包括：提供页面配置信息输入面板，接收用户在所述页面配置信息输入面板输入的所述菜单的配置信息及所述菜单的前端路由配置信息；将所述菜单的配置信息及所述菜单的前端路由配置信息通过第一接口返回给后端；及通过第二接口从所述后端获取所述菜单的配置信息及所述菜单的前端路由配置信息。3.根据权利要求1所述的前端路由生成方法，其特征在于，所述解析所述菜单的配置信息及所述前端路由配置信息包括：预先定义全局路由钩子函数，并利用所述全局路由钩子函数对所述菜单的配置信息及所述前端路由配置信息进行解析。4.根据权利要求3所述的前端路由生成方法，其特征在于，所述利用所述全局路由钩子函数对所述菜单的配置信息及所述前端路由配置信息进行解析包括：将vue
‑
router插件的beforeEach钩子函数作为所述全局路由钩子函数；在路由文件中添加所述vue
‑
router插件的beforeEach钩子函数；通过所述beforeEach钩子函数调用后端的第二接口解析出所述菜单的配置信息及所述前端路由配置信息。5.根据权利要求1所述的前端路由生成方法，其特征在于，所述根据解析后的所述前端路由配置信息生成所述菜...

【专利技术属性】
技术研发人员：唐修江，
申请(专利权)人：中国平安财产保险股份有限公司，
类型：发明
国别省市：