一种前端选项卡的优化加载方法及装置与流程

本发明涉及前端，具体提供一种前端选项卡的优化加载方法及装置。

背景技术：

1、在进行选项卡的前端研发的过程中,在切换当前tab的索引的时候，需要记住当前切换之后的索引值，并且是重新加载下当前部分组件，而不是重新记载当前界面所有的组件；另外在进行浪潮云的前端鉴权的应用的时候，由于鉴权接口的请求不及时性，需要优先加载下鉴权接口，以确保当前按钮或者标签的权限正确，才能及时的响应鉴权接口的反馈并外现在界面上。

2、由此,在前端选项卡研发的过程中，加载的时效性和界面渲染的有效性太低，无法及时反馈响应当前的界面需求。

技术实现思路

1、本发明是针对上述现有技术的不足，提供一种实用性强的前端选项卡的优化加载方法。

2、本发明进一步的技术任务是提供一种设计合理，安全适用的前端选项卡的优化加载装置。

3、本发明解决其技术问题所采用的技术方案是：

4、一种前端选项卡的优化加载方法，首先在前端工程的tab组件里使用懒加载的属性，即在切换当前tab组件的时候才开始加载当前组件下的dom结构以及相关接口，进而保证当前dom能及时的用到所用接口的参数，保证鉴权的参数准确，并及时响应dom的权限加载。

5、进一步的，在运用懒加载的技术之后，前端鉴权组件in-acl-source可以根据当前的传参值传参给鉴权接口has-permissions，确定ingroup当前是属于那个鉴权group,根据鉴权group找到鉴权组件的标识。

6、进一步的，根据inservice服务名称、inservicetype资源类型和inacions需要鉴权的列表，需要和接口配合，需要鉴权的按钮参数均在inactions,当及时拿到了这些参数的值并且及时的传参给has-permission接口，has-permisson接口响应当前账户的当前标识的鉴权权限。

7、进一步的，has-permisson接口响应当前账户的当前标识的鉴权权限，赋值给dom结构，前端dom结构进行相应的标签处理，button按钮的及时赋值disabled属性，并给出当前未能赋值权限的中文提示，反馈在界面上就是当鼠标划过button按钮的时候，在button按钮的上方会悬浮当前未能赋值权限的提示。

8、进一步的，所述提示是嵌套在button按钮的外面的div结构上的，是为了适配还有其他按钮的情况。

9、进一步的，在button按钮的上方如果是块标签li，那赋值当前菜单的nz-menu-item的nzdisabled属性，进而禁止或者放开当前块标签的点击，同样的在块标签的上方悬浮当前不能点击的中文提示。

10、进一步的，在button按钮的上方是a标签，对a标签的样式进行相应的处理，不可点击的样式赋值给a标签，也是在a标签上方给与是否有权限的中文提示。

11、进一步的，当运用了tab懒加载的技术以后，不再关注当前index，仅需在当前tab组件加载当前列表的loadcomponent组件方法，然后在父组件详情界面的刷新按钮方法上根据当前tab子组件的属性标识进行判断即可，调取当前子组件的加载方法，实现当前子组件的刷新按钮的正常使用。

12、一种前端选项卡的优化加载装置，包括：至少一个存储器和至少一个处理器；

13、所述至少一个存储器，用于存储机器可读程序；

14、所述至少一个处理器，用于调用所述机器可读程序，执行一种前端选项卡的优化加载方法。

15、本发明的一种前端选项卡的优化加载方法及装置和现有技术相比，具有以下突出的有益效果：

16、本发明可以合理有效的加载当前tab所需要的需求功能，方便高效。

技术特征：

1.一种前端选项卡的优化加载方法，其特征在于，首先在前端工程的tab组件里使用懒加载的属性，即在切换当前tab组件的时候才开始加载当前组件下的dom结构以及相关接口，进而保证当前dom能及时的用到所用接口的参数，保证鉴权的参数准确，并及时响应dom的权限加载。

2.根据权利要求1所述的一种前端选项卡的优化加载方法，其特征在于，在运用懒加载的技术之后，前端鉴权组件in-acl-source可以根据当前的传参值传参给鉴权接口has-permissions，确定ingroup当前是属于那个鉴权group,根据鉴权group找到鉴权组件的标识。

3.根据权利要求2所述的一种前端选项卡的优化加载方法，其特征在于，根据inservice服务名称、inservicetype资源类型和inacions需要鉴权的列表，需要和接口配合，需要鉴权的按钮参数均在inactions,当及时拿到了这些参数的值并且及时的传参给has-permission接口，has-permisson接口响应当前账户的当前标识的鉴权权限。

4.根据权利要求3所述的一种前端选项卡的优化加载方法，其特征在于，has-permisson接口响应当前账户的当前标识的鉴权权限，赋值给dom结构，前端dom结构进行相应的标签处理，button按钮的及时赋值disabled属性，并给出当前未能赋值权限的中文提示，反馈在界面上就是当鼠标划过button按钮的时候，在button按钮的上方会悬浮当前未能赋值权限的提示。

5.根据权利要求4所述的一种前端选项卡的优化加载方法，其特征在于，所述提示是嵌套在button按钮的外面的div结构上的，是为了适配还有其他按钮的情况。

6.根据权利要求5所述的一种前端选项卡的优化加载方法，其特征在于，在button按钮的上方如果是块标签li，那赋值当前菜单的nz-menu-item的nzdisabled属性，进而禁止或者放开当前块标签的点击，同样的在块标签的上方悬浮当前不能点击的中文提示。

7.根据权利要求6所述的一种前端选项卡的优化加载方法，其特征在于，在button按钮的上方是a标签，对a标签的样式进行相应的处理，不可点击的样式赋值给a标签，也是在a标签上方给与是否有权限的中文提示。

8.根据权利要求7所述的一种前端选项卡的优化加载方法，其特征在于，当运用了tab懒加载的技术以后，不再关注当前index，仅需在当前tab组件加载当前列表的loadcomponent组件方法，然后在父组件详情界面的刷新按钮方法上根据当前tab子组件的属性标识进行判断即可，调取当前子组件的加载方法，实现当前子组件的刷新按钮的正常使用。

9.一种前端选项卡的优化加载装置，其特征在于，包括：至少一个存储器和至少一个处理器；

技术总结
本发明涉及前端技术领域，具体提供了一种前端选项卡的优化加载方法，首先在前端工程的tab组件里使用懒加载的属性，即在切换当前tab组件的时候才开始加载当前组件下的dom结构以及相关接口，进而保证当前dom能及时的用到所用接口的参数，保证鉴权的参数准确，并及时响应dom的权限加载。与现有技术相比，本发明可以合理有效的加载当前tab所需要的需求功能，方便高效，具有良好的推广价值。

技术研发人员：黄华,宋亚萍,于沈课
受保护的技术使用者：浪潮云信息技术股份公司
技术研发日：
技术公布日：2024/1/13