vue項目實現動態路由的方式大體可分為兩種:

1.前端這邊把路由寫好，登錄的時候根據用戶的角色權限來動態展示路由，(前端控制路由)

2.后臺傳來當前用戶對應權限的路由表，前端通過調接口拿到路由信息后處理(后端處理路由)

這兩種方法各有優點，效果都能實現，我們公司現在用的就是第二種，后臺返回路由信息，前端動態生成路由及菜單。我們就講講實現的邏輯。

我們用動態路由，需要后臺提供路由信息，那前臺肯定有對應編輯輸入的地方，我們的系統放到菜單里。

父級節點 父級

節點ID 自動生成

菜單名稱 菜單名稱

權限標識

圖標 菜單前面的圖標

類型 分為菜單和按鈕

排序

前端組件 組件在項目中的位置

前端地址 瀏覽器路由地址

拿用戶管理來說，

前端組件views/admin/user/index對應我們項目中的

左側菜單調用調用接口請求菜單數據返回格式

在index.vue中，調用菜單接口，處理接口返回數據，重點在紅圈內

總結，菜單返回的信息要包含router信息，這個信息不能直接使用，需要重新封裝路由，用router.addRoutes(asyncRouters)把路由信息重新添加。

總結

以上是生活随笔為你收集整理的ant design vue input change_Ant-design-vue项目实现动态路由的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。