vue-cli3中，重复点击同一个标签实现路由跳转，出现Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation

bailizx

于 2020-07-02 15:34:19 发布

阅读量1.6k

点赞数 1

分类专栏： vue # js开发过程中遇到的问题文章标签： Vue-Router3 vue报错

本文链接：https://blog.csdn.net/abc1194474469/article/details/107084442

版权

在Vue-Router3.1.0+版本中，重复点击同一路由标签会导致Uncaught (in promise) NavigationDuplicated错误。原因是router.push或router.replace返回的Promise未被捕获。解决方案包括降级Vue-Router版本、每次调用时捕获异常，或者重写router.push/replace方法。推荐重写方法，以避免每次调用时额外添加catch。

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

1 错误

2 原因

3 解决方法

1 错误

vue中，连续多次单击同一个路由标签（单击该标签会发生路由跳转）跳转路由时，出现Uncaught (in promise)错误。

如：上代码以及图如下

<template>
  <div class = "footerGuideStyle">
    <a href="javascript:;" class = "footerItems" v-bind:class = "{on: isPath('/msite')}" v-on:click = "goTo('/msite')">
      <span>
        <i class = "iconfont icon-waimai"></i>
      </span>
      <span>首页</span>
    </a>
    <a href="javascript:;" class = "footerItems" :class = "{on: isPath('/search')}" @click = "goTo('/search')">
      <span>
        <i class = "iconfont i