Ant-design-vue项目实现动态路由

最新推荐文章于 2024-01-25 23:42:51 发布

NMGWAP

最新推荐文章于 2024-01-25 23:42:51 发布

阅读量636

点赞数

文章标签： java vue python js javascript

本文链接：https://blog.csdn.net/NMGWAP/article/details/125066856

版权

本文介绍了在vue项目中使用Ant-design-vue实现动态路由的两种方式：前端控制路由和后端处理路由。重点讲解了公司采用的后端返回路由信息，前端动态生成路由及菜单的方法。涉及调用接口获取用户权限对应的路由信息，然后在前端进行处理并添加到路由中。

摘要由CSDN通过智能技术生成

vue项目实现动态路由的方式大体可分为两种:
1.前端这边把路由写好，登录的时候根据用户的角色权限来动态展示路由，(前端控制路由)

2.后台传来当前用户对应权限的路由表，前端通过调接口拿到路由信息后处理(后端处理路由)

这两种方法各有优点，效果都能实现，我们公司现在用的就是第二种，后台返回路由信息，前端动态生成路由及菜单。我们就讲讲实现的逻辑。

我们用动态路由，需要后台提供路由信息，那前台肯定有对应编辑输入的地方，我们的系统放到菜单里。

父级节点        父级
节点ID          自动生成
菜单名称        菜单名称
权限标识        
图标            菜单前面

关注