美文网首页
Navigating to current location (

Navigating to current location (

作者: 小白的踩坑日常 | 来源:发表于2020-06-24 09:45 被阅读0次

终于找到问题根源了:
(出处:https://stackoverflow.com/questions/58056675/vuejs-navigating-to-current-location-is-not-allowed

Finally I understand why it happened. The error you see in the console is part of the new promise api: before, if no callbacks were supplied to router.push, errors were only sent to the global router error handler. Now, because both push and replace return a promise, if the navigation failure (anything that cancels a navigation like a next(false) or next('/other') also counts) is not caught, you will see an error in the console because that promise rejection is not caught. However, the failure was always there because trying to navigate to same location as the current one fails. It's now visible because of the promise being rejected but not caught.

I able to solve this issue with 2 solutions as following. The first solutions is using router-link.

<router-link
  to="/Error"
  v-slot="{ href, route, navigate, isActive, isExactActive }"
>

</router-link>

The second solutions is add catch in my function

   this.$router.replace({
        name: 'Error',
        query: {
          showRefresh: true,
        }).catch(err => {})

或者直接将push的捕获错误函数直接挂在router原型上。
这里我还踩了个原型链的小坑,

const router = new VueRouter({
    routes,
    mode:"history"
})
const Epush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return Epush.call(this, location).catch(data => {  })
}

代码里,我曾把函数挂在实例router上,报错找不到push属性,要记得挂在原型上哦

相关文章

网友评论

      本文标题:Navigating to current location (

      本文链接:https://www.haomeiwen.com/subject/cjnlfktx.html