出現(xiàn)這個問題辆床，控制臺會報[NavigationDuplicated?{_name: "NavigationDuplicated", name: "NavigationDuplicated"}]。其原因在于Vue-router在3.1之后把$router.push()方法改為了Promise邢笙。所以假如沒有回調(diào)函數(shù)挑势，錯誤信息就會交給全局的路由錯誤處理列粪，因此就會報上述的錯誤薇宠。
如果你仔細觀察并復(fù)現(xiàn)了多次錯誤你會發(fā)現(xiàn)肖油，vue-router是先報了一個Uncaught (in promise)的錯誤(因為push沒加回調(diào))，然后再點擊路由的時候才會觸發(fā)NavigationDuplicated的錯誤(路由出現(xiàn)的錯誤烦绳，全局錯誤處理打印了出來)卿捎。
解決方案
1.固定vue-router版本到3.0.7以下。
2.禁止全局路由錯誤處理打印径密，這個也是vue-router開發(fā)者給出的解決方案
import Router from 'vue-router'const originalPush = Router.prototype.push
Router.prototype.push = functionpush(location, onResolve, onReject){
? if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
? return originalPush.call(this, location).catch(err=> err)
}
3.vue-router的開發(fā)者也給出了解決方法午阵，你需要為每個router.push增加回調(diào)函數(shù)。
router.push('/location').catch(err=> {err})
4.如果你使用了Element-UI享扔，并且方案2無法解決你的問題底桂。那么你只能用方案1來固定你的vue-router版本了。這是因為Element-UI的el-menu在重復(fù)點擊路由的時候報的錯誤惧眠，而且這個錯誤是Element-UI內(nèi)部的路由問題籽懦，你無法通過方案2和3去解決。只能選擇暫時不升級Vue-router氛魁。
好消息是Element-UI已經(jīng)有了解決方案暮顺，預(yù)計在2.13.0版本會解決這個問題。參考Github上issue#17269秀存。
原文鏈接參考：參考
