解決vue-router報(bào)NavigationDuplicated: Avoided redundant navigation to current location 的問(wèn)題
最近寫(xiě)項(xiàng)目的時(shí)候， 重復(fù)點(diǎn)擊路由會(huì)在控制臺(tái)報(bào)
這樣的錯(cuò)誤裙犹。
image
它的提示是 避免到當(dāng)前位置的冗余導(dǎo)航唇撬。 簡(jiǎn)單來(lái)說(shuō)就是重復(fù)觸發(fā)了同一個(gè)路由糯俗。
這個(gè)錯(cuò)誤是 vur-router更新以后新出現(xiàn)的錯(cuò)誤巷帝。（我使用的是 vue-router 3.2.0）出現(xiàn)的 但是 （vue-router 3.0.6) 沒(méi)有出現(xiàn)。 但是也不排除是我的 3.0.6之前做過(guò)配置菲饼。
解決這個(gè)錯(cuò)誤也非常簡(jiǎn)單吵护。只需要在router /index的頁(yè)面里面 加入
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}
這行代碼就可以了
他的位置大概在這里
image.png
加上這個(gè)代碼后 不報(bào)錯(cuò)了 但是依然 跳轉(zhuǎn)不了
解決 最后看代碼 發(fā)現(xiàn) 加上這個(gè)就可以了
<template>
<div class="">
<!-- 頁(yè)面切換不刷新 -->
<!-- <keep-alive> -->
<router-view></router-view>
<!-- </keep-alive> -->
</div>
</template>
