原因:报错原因:多次点击同一路由,导致路由被多次添加

解决:在引入路由的地方

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
//重写router的push方法

  const VueRouterPush = router.prototype.push

  router.prototype.push = function push (to) {

    return VueRouterPush.call(this, to).catch(err => err)

  }

vue路由中 Navigating to current location ("/xxx") is not allowed的更多相关文章

  1. vue路由中 Navigating to current location ("/router") is not allowed

    报错原因:多次点击同一路由,导致路由被多次添加 解决方法: router/index中添加以下代码: //router/index.js Vue.use(VueRouter) //导入vue路由 co ...

  2. 解决vue项目路由出现message: "Navigating to current location (XXX) is not allowed"的问题(点击多次跳转)

    如果网页跳转用的方法传参去跳转: (点击多次链接会出现错误) <a class="" href="javascript:void(0);" @click= ...

  3. NavigationDuplicated Navigating to current location (“/XXX”) is not allowed

    导航不允许导航到当前位置https://stackoverflow.com/questions/57837758/navigationduplicated-navigating-to-current- ...

  4. vue-routerV3.1版本报错:message: "Navigating to current location ("/home") is not allowed",

    出现这个错误的原因是,在路由跳转的时候两次push的path地址相同 解决方法两种: 1.切换版本回3.0版本 2.在你引了vue-router的js文件里加上如下代码即可 import VueRou ...

  5. Vue Avoided redundant navigation to current location Error

    这个报错的根源就是vue-router组件,错误内容翻译一下是: Avoided redundant navigation to current location === 避免冗余导航到当前位置 这个 ...

  6. Vue 路由跳转报错 Error: Avoided redundant navigation to current location: "/XXX".

    在router文件夹下的index.js中加入红色字体代码即可解决 import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(V ...

  7. vue路由中的 Meta

    在项目中肯定有这样的需求,那就是在某个页面的时候,顶部展示 现在当前的页面路径,如下图: 这个在vue中其实很好实现. 首先出现这个肯定是相对应不同的页面,也就是说对应不同的路由,我们在定义路由的时候 ...

  8. 如何去掉vue路由中的#

    通过脚手架vue-cli构建的项目,在项目启动后,URL地址上都会带有#,如:http://localhost:8080/#/father 原因:这是因为vue-router 默认hash模式, 使用 ...

  9. vue路由中使用keep-alive 以及activated和deactivated 钩子

    本次只是记录下开发中碰到的问题. 最近做一个活动页面,涉及到角色和权限的问题,需要跳转很多页面,于是vue-router走起,顺便keep-alive也用起来了,嗯,跳转的很爽,但是一个详情页面组件, ...

  10. Navigating to current location ("/") is not allowed

    main.js import Router from 'vue-router' // 这个是为了避免一个报错 const originalPush = Router.prototype.push; R ...

随机推荐

  1. wsl2 使用串口/usb

    wsl2串口 搜了几个方案,都不合适 网上很多人说wsl可以直接使用win的串口,com* 就对应 /dev/ttyS* 实际上这是wsl1的,wsl2官方明确表示不支持了 CH340 介绍 CH34 ...

  2. SPI的 CLK_POL和CLK_PHA

    1.模式0(CPOL=0,CPHA=0) 模式0特性: CPOL = 0:空闲时是低电平,第1个跳变沿是上升沿,第2个跳变沿是下降沿 CPHA = 0:数据在第1个跳变沿(上升沿)采样 2.模式1(C ...

  3. Windows环境下FTP Server在局域网内的搭建

    什么是FTP? File transfer protocol sreveris a computer software that facilitate the secure rxchange of f ...

  4. 体验AI乐趣:基于AI Gallery的二分类猫狗图片分类小数据集自动学习

    摘要:直接使用AI Gallery里面现有的数据集进行自动学习训练,很简单和方便,节约时间,不用自己去训练了,AI Gallery 里面有很多类似的有趣数据集,也非常好玩,大家一起试试吧. 本文分享自 ...

  5. Vue3 ref 模板引用获取不到节点

    ref模板引用必须要在组件实例挂载完成之后才可以访问.如果你是在组合式 API 里面写的组件,那么 setup 函数比任何周期函数都早,所以不可能在该函数中执行时获取得到ref--组件实例. 官网关于 ...

  6. because another server process exited abnormally and possibly corrupted shared memory

    一.环境 系统平台:Linux x86-64 Red Hat Enterprise Linux 7 版本:4.1.1   二.症状 Red Hat 7.2操作系统部署HGDB 4.1.1后,日志经常出 ...

  7. 通过源码分析RocketMQ主从复制原理

    作者:京东物流 宫丙来 一.主从复制概述 RocketMQ Broker的主从复制主要包括两部分内容:CommitLog的消息复制和Broker元数据的复制. CommitLog的消息复制是发生在消息 ...

  8. rn项目启动时卡在Task :app:checkDebugAarMetadata

    原因是Gradle在下载依赖,打开Android Studio就可以看到右下角在下载.

  9. HttpProxyCacheServer (音视频缓存框架)

    implementation 'com.danikula:videocache:2.7.0' //包 MyApplication 中: //音视频缓存框架private HttpProxyCacheS ...

  10. No.2.7

    响应式 什么是响应式网页?就是一套代码适配不同的屏幕宽度,不同的适配 媒体查询:能够根据设备宽度的变化,设置差异化样式 开发常用写法: 媒体特性常用写法 max-width min-width @me ...