重復(fù)路由

報錯:Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location...
在使用this.$router.push跳轉(zhuǎn)頁面時候,重復(fù)點擊菜單引起路由重復(fù)報錯
1 只需在 router 文件夾下

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/views/Home'
import Main from '@/views/Main'
import User from '@/views/User'
Vue.use(VueRouter)
 
// 0. 如果使用模塊化機制編程,導(dǎo)入Vue和VueRouter,要調(diào)用 Vue.use(VueRouter)
// 1. 定義 (路由) 組件。
// 可以從其他文件 import 進來
 
// 2. 定義路由
// 每個路由應(yīng)該映射一個組件。 其中"component" 可以是
// 通過 Vue.extend() 創(chuàng)建的組件構(gòu)造器,
// 或者,只是一個組件配置對象。
// 我們晚點再討論嵌套路由。
const routes = [
  // //主路由
  {
    path: '/',
    component: Main,
    redirect:"home",
    children: [//子路由,嵌套路由
      {
        path: 'home',
        component: Home
      },
      {
        path: 'user',
        component: User
      },
      {
        path: "/acl/user",
        name: "user",
        title: "用戶管理",
        icon: "setting",
        component: () => import("@/views/acl/user/List.vue"),
      },
      {
        path: "/acl/role",
        name: "role",
        title: "角色管理",
        icon: "setting",
        component: () => import("@/views/acl/role/List.vue"),
      },
      {
        path: "/acl/menu",
        name: "menu",
        title: "菜單管理",
        icon: "setting",
        component: () => import("@/views/acl/menu/List.vue"),
      }
      // ,
      // {
      //   title: "權(quán)限管理",
      //   icon: "s-order",
      //   name: "/acl",
      //   path: '/acl',
      //   children: [
      //     {
      //       path: "/user1",
      //       name: "user",
      //       title: "用戶管理",
      //       icon: "setting",
      //       component: () => import("@/views/acl/user/List.vue"),
      //     },
      //     {
      //       path: "/acl/role",
      //       name: "role",
      //       title: "角色管理",
      //       icon: "setting",
      //       component: () => import("@/views/acl/role/List.vue"),
      //     },
      //     {
      //       path: "/acl/menu",
      //       name: "menu",
      //       title: "菜單管理",
      //       icon: "setting",
      //       component: () => import("@/views/acl/menu/List.vue"),
      //     },
      //   ],
      // },
    ]
  },
 
 
 
]
 
// 3. 創(chuàng)建 router 實例,然后傳 `routes` 配置
// 你還可以傳別的配置參數(shù), 不過先這么簡單著吧。
const router = new VueRouter({
  routes // (縮寫) 相當于 routes: routes
})
 
// 4. 創(chuàng)建和掛載根實例。(在main.js里繼續(xù)掛載)
// 記得要通過 router 配置參數(shù)注入路由,
// 從而讓整個應(yīng)用都有路由功能
 
// 解決重復(fù)點擊導(dǎo)航時,控制臺出現(xiàn)報錯
const VueRouterPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (to) {
  return VueRouterPush.call(this, to).catch(err => err)
}
 
export default router
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容