警告[vue-router]?Duplicate?named?routes?definition簡單解決方法
更新時間：2023年12月12日 14:44:24 作者：前進(jìn)的北極熊
這篇文章主要關(guān)于介紹了警告[vue-router]?Duplicate?named?routes?definition的解決方法,這個錯誤提示是因為在Vue Router中定義了重復(fù)的路由名稱,需要的朋友可以參考下
出現(xiàn)警告：
退出登錄再登錄后 控制臺路由命命名重復(fù)警告問題
發(fā)現(xiàn)自己的name并沒有重名,那么一般是后臺動態(tài)路由導(dǎo)致的報錯警告
動態(tài)路由一般來說是通過后端接口返回拿到數(shù)據(jù),然后在路由守衛(wèi)router.beforeEach中進(jìn)行添加
addRoutes方法僅僅是幫你注入新的路由,并沒有幫你剔除其他路由
解決方法：
router/index.js中：
const createRouter = () => new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
/*
解決:退出登錄再登錄后 控制臺路由命命名重復(fù)警告問題
發(fā)現(xiàn)自己的name并沒有重名,那么一般是后臺動態(tài)路由導(dǎo)致的報錯警告
動態(tài)路由一般來說是通過后端接口返回拿到數(shù)據(jù),然后在路由守衛(wèi)router.beforeEach中進(jìn)行添加
addRoutes方法僅僅是幫你注入新的路由,并沒有幫你剔除其他路由
*/
const router = createRouter();
// 重置路由
export function resetRouter() {
const newRouter = createRouter();
router.matcher = newRouter.matcher; // the relevant part
}
導(dǎo)航全局前置守衛(wèi)中：發(fā)現(xiàn)是addRoute()導(dǎo)致的，所以在添加路由之前要重置路由
重置之后，黃色警告就沒有了。
總結(jié)
到此這篇關(guān)于警告[vue-router] Duplicate named routes definition簡單解決方法的文章就介紹到這了,更多相關(guān)vue-router Duplicate named routes definition內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:
相關(guān)文章
vue轉(zhuǎn)react useEffect的全過程
這篇文章主要介紹了vue轉(zhuǎn)react useEffect的全過程，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
Vue+express+Socket實現(xiàn)聊天功能
這篇文章主要為大家詳細(xì)介紹了Vue+express+Socket實現(xiàn)聊天功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
利用FetchEventSource在大模型流式輸出的應(yīng)用方式
這篇文章主要介紹了利用FetchEventSource在大模型流式輸出的應(yīng)用方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
本篇文章主要介紹了Vue的Class與Style綁定的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
這篇文章主要介紹了vue?中使用?bimface詳情,分別有安裝?vue?腳手架、創(chuàng)建項目、引入?bimface?響應(yīng)的文件、修改?App.vue?文件，實現(xiàn)頁面渲染等步驟，需要的小伙伴可以參考一下2021-12-12
這篇文章主要介紹了vue打包npm run build時候界面報錯的解決，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
Vue Echarts實現(xiàn)圖表輪播圖以及圖表組件封裝和節(jié)流函數(shù)優(yōu)化講解
這篇文章主要介紹了在Vue中優(yōu)雅的使用Echarts實現(xiàn)圖表輪播圖、Echarts圖表組件封裝、節(jié)流函數(shù)優(yōu)化圖表性能，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-01-01
這篇文章主要介紹了vue中使用swiper5方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05
el-table表格點擊該行任意位置時也勾選上其前面的復(fù)選框
本文主要介紹了在el-table組件中實現(xiàn)雙擊表格某一行任意位置自動勾選復(fù)選框的功能,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2025-02-02
使用Element的InfiniteScroll 無限滾動組件報錯的解決
這篇文章主要介紹了使用Element的InfiniteScroll 無限滾動組件報錯的解決，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07