如何通过Vue实现动态添加路由并构建菜单示例？

本文共计1268个文字，预计阅读时间需要6分钟。

后台管理系统，普遍存在这样的需求：根据后台数据动态添加路径和菜单。为什么这么做？因为不同用户有不同的权限，可访问的页面也不尽相同。在网上找到了很多相关资料。

写后台管理系统，估计有不少人遇过这样的需求：根据后台数据动态添加路由和菜单。

为什么这么做呢？因为不同的用户有不同的权限，能访问的页面是不一样的。

在网上找了好多资料，终于想到了解决办法。

动态生成路由

利用 vue-router 的 addRoutes 方法可以动态添加路由。

先看一下官方介绍：

router.addRoutes

router.addRoutes(routes: Array<RouteConfig>)

动态添加更多的路由规则。参数必须是一个符合 routes 选项要求的数组。