技術標籤：vueJavaScriptbug解決

解決 Uncaught (in promise) Error: Navigation cancelled from “/Search#1608911018888” to “/Search#1608911019245” with a new navigation.

這個錯誤是vue-router內部錯誤,沒有進行catch處理,導致的程式設計式導航跳轉問題,往同一地址跳轉時會報錯的情況

push和replace 都會導致這個情況的發生

解決方法如下:在路由器中進行配置

import VueRouter from 'vue-router';
Vue.use
 
(VueRouter);
//解決程式設計式路由往同一地址跳轉時會報錯的情況
const originalPush = VueRouter.prototype.push
const originalReplace = VueRouter.prototype.replace
//push
VueRouter.prototype.push = function push(location, onResolve, onReject) {
    if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
 

    return originalPush.call(this, location).catch(err => err)
}
//replace
VueRouter.prototype.replace = function push(location, onResolve, onReject) {
    if (onResolve || onReject) return originalReplace.call(this, location, onResolve, onReject)
    return originalReplace.call(this, location).catch
 
(err => err)
}