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

解决方法:

router/index中添加以下代码:

//router/index.js
Vue.use(VueRouter) //导入vue路由
const VueRouterPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (to) {
return VueRouterPush.call(this, to).catch(err => err)
}

之后就不会再报路由错误了

参考自:https://www.jianshu.com/p/a140ad42ef00

以上。

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

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

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

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

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

  3. Vue Avoided redundant navigation to current location Error

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

  4. vue路由中的 Meta

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

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

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

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

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

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

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

  8. 解决vue路由history模式刷新后404的问题

    server { listen ;#默认端口是80,如果端口没被占用可以不用修改 server_name localhost; root E:/vue/my_project/dist;#vue项目的打 ...

  9. vue路由history模式刷新页面出现404问题

    vue hash模式下,URL中存在'#',用'history'模式就能解决这个问题.但是history模式会出现刷新页面后,页面出现404.解决的办法是用nginx配置一下.在nginx的配置文件中 ...

随机推荐

  1. HDU 4325 Flowers 树状数组+离散化

    Flowers Problem Description As is known to all, the blooming time and duration varies between differ ...

  2. 七大Github机器学习热门项目

    译者 | 小韩 来源 | analyticsvidhya.com[磐创AI导读]:让我们一起来看下近期热门的机器学习Github仓库,包括了自然语言处理(NLP).计算机视觉(CV)与大数据等多个领域 ...

  3. MATLAB——nctoolbox安装及使用

    1.nctoolbox安装 nctoolbox是一个Matlab工具箱,它提供对通用数据模型数据集的只读访问. (1)下载nctoolbox安装包. 地址:https://code.google.co ...

  4. 树莓派中Docker部署.Net Core 3.1 (一)

    一.背景 受疫情影响,已经在家强制事假一个月了,除了刷简历外就是在家学习,闲来无事,最近买了几个树莓派4B的板子回来,准备用树莓派搭建个自动部署的平台和微服务示例,长话短说,节约时间,直接进入正题吧 ...

  5. linux系统部署安装过程

    1. 虚拟环境安装 1.新建虚拟机   2.虚拟机设置 2.系统历程 1.进入系统引导界面进行配置 引导项说明:            1.安装centos 系统                    ...

  6. 九九乘法表 C语言

    无需输入,直接输出九九乘法表,特别简单. 运行结果如下: #include<stdio.h> int main() { ; ; , j = ; ; i < ; i++,b++) { ...

  7. 浅谈Java构造器

    Java构造器 每个类都有构造方法.如果没有显式地为类定义构造方法,Java编译器将会为该类提供一个默认构造方法. 在创建一个对象的时候,至少要调用一个构造方法.构造方法的名称必须与类同名,一个类可以 ...

  8. hadoop+zookeeper集群高可用搭建

                                                                  hadoop+zookeeper集群高可用搭建 Senerity 发布于 2 ...

  9. Linux:启动http服务

    1.安装apache yum install httpd #根据提示,输入Y安装即可成功安装 systemctl start httpd.service #启动apache systemctl sto ...

  10. scratch算立方根

    10((1/3)lgx)=x(1/3)也就是立方根