重复push同一个路由

is今夕

已于 2022-09-19 16:40:57 修改

阅读量451

点赞数

分类专栏： # vue 前端文章标签：前端

于 2022-03-01 10:19:10 首次发布

本文链接：https://blog.csdn.net/the_love_story/article/details/123199438

版权

前端同时被 2 个专栏收录

26 篇文章 0 订阅

订阅专栏

vue

15 篇文章 0 订阅

订阅专栏

这段代码展示了如何在Vue Router中重写`push`方法以捕获并处理重复push相同路由的错误。当没有`onComplete`和`onAbort`回调并且`Promise`可用时，它返回一个新的Promise，允许异步操作。如果push操作导致错误，代码会捕获该错误但不做进一步处理。这有助于避免冗余导航并控制路由行为。

摘要由CSDN通过智能技术生成

const originalPush = Router.prototype.push
console.log(originalPush)
/*
VueRouter.prototype.push = function push(location, onComplete, onAbort) {
    var this$1 = this;
    console.log("222", location, onComplete, onAbort, typeof Promise)

    // $flow-disable-line
    if (!onComplete && !onAbort && typeof Promise !== 'undefined') {
        return new Promise(function(resolve, reject) {
            this$1.history.push(location, resolve, reject);
        }
        )
    } else {
        this.history.push(location, onComplete, onAbort);
    }
}

*/
Router.prototype.push = function push(location) {
  // 重复push同一个路由，捕捉错误，不做处理
  // Avoided redundant navigation to current location: "/login"

  return originalPush.call(this, location).catch(err => {
    // console.log("err", err)
    return err
  })
}