Vue 路由跳转报错 Error: Avoided redundant navigation to current location: "/XXX".
在router文件夹下的index.js中加入红色字体代码即可解决
import Vue from 'vue'
import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [
{
path: '/',
name: 'Login',
component: () => import('../views/Login.vue')
},
{
path: '/login',
name: 'Login',
component: () => import('../views/Login.vue')
},
{
path: '/home',
name: 'Home',
component: () => import('../views/Home.vue')
}
] const router = new VueRouter({
routes
}) const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
} export default router
Vue 路由跳转报错 Error: Avoided redundant navigation to current location: "/XXX".的更多相关文章
- vue-router 报错、:Avoided redundant navigation to current location 错误、路由重复
在用vue-router 做单页应用的时候重复点击一个跳转的路由会出现报错 这个报错是重复路由引起的只需在注册路由组建后使用下方重写路由就可以 const originalReplace = VueR ...
- Vue Avoided redundant navigation to current location Error
这个报错的根源就是vue-router组件,错误内容翻译一下是: Avoided redundant navigation to current location === 避免冗余导航到当前位置 这个 ...
- vue路由跳转报错解决
vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...
- Avoided redundant navigation to current location: "/users"
问题产生的原因:在Vue导航菜单中,重复点击一个菜单,即重复触发一个相同的路由,会报错,但不影响功能 解决:在router的配置文件中加入如下代码: const originalPush = Rout ...
- 10. vue axios 请求未完成时路由跳转报错问题
axios 请求未完成时路由跳转报错问题 前两天项目基本功能算是完成了,在公司测试时遇到了遇到了一个问题,那就是在请求未完成时进行路由跳转时会报错,想了几种办法来解决,例如加loading,请求拦截, ...
- 去除vue路由跳转地址栏后的哈希值#
去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值# mode:"history" import ...
- Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决
今天碰到一个问题 vue路由跳转到新的页面时会直接显示页面最底部 正常情况下是显示的最顶部的 而且好多路由中不是全部都是这种情况 折腾好长时间也没解决 最后在网上找到了解决办法 其实原理很 ...
- vue路由跳转的方式
vue路由跳转有四种方式 1. router-link 2. this.$router.push() (函数里面调用) 3. this.$router.replace() (用法同push) 4. t ...
- vue路由跳转取消上个页面的请求和去掉重复请求
vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求
随机推荐
- WinForm PerformClick()
在Winfrom开发中,经常遇到调用Click事件,如:btn_click(null,null),其实winfrom也自带一个模拟点击事件:PerformClick(),区别就是:前者无论控件是否En ...
- MySQL 执行优化查询
查询执行的基础 当希望MySQL能够以更高的性能运行查询时,最好的办法就是弄清楚MySQL是如何优化和执行查询的.当向MySQL发送一个请求的时候,MySQL执行过程如图1-1所示: 图1-1 查询执 ...
- NTP\rsync+inotify
NTP网络时间协议 NTP(Network Time Protocol)网络时间协议基于UDP,用于网络时间同步的协议,使网络中的计算机时钟同步到UTC(世界统一时间),再配合各个时区的偏移调整就能实 ...
- [开源]入坑Qt,我的第一个小程序:MD5计算器
版权声明 --------- 本文仅在知乎与博客园发布.开发者为szx0427 MFC和Win32搞了好几年了,也算是懂了个皮毛,但是一直觉得用这两者开发软件都很麻烦,需要将大量的代码花费在UI等地方 ...
- 华为应用市场更新APP多次被拒
最近公司的APP发布了新版本,只进行了线上bug的修复,基本没改什么主体业务功能.各大应用市场都顺利更新上架,但是国货之光华为,被闷了几次.拒来拒去,就是那些反复的内容.内容一般如下: 经检测发现,您 ...
- Shell-14-常用命令和工具
常用命令 有人说 Shell 脚本是命令堆积的一个文件, 按顺序去执行 还有人说想学好 Shell 脚本,要把 Linux 上各种常见的命令或工具掌握了,这些说法都没错 Shell 语言本身在语法结构 ...
- Flink项目实战(一)---核心概念及基本使用
前言.flink介绍: Apache Flink 是一个分布式处理引擎,用于在无界和有界数据流上进行有状态的计算.通过对时间精确控制以及状态化控制,Flink能够运行在任何处理无界流的应用中,同时对有 ...
- Blazor+Dapr+K8s微服务之开发环境调试
1 安装Dapr开发调试环境 1.1 Dapr 完整安装模式不支持开发调试 在上一篇随笔<Blazor+Dapr+K8s微服务之服务调用>中,我们通过为每个 ...
- 【Python机器学习实战】决策树和集成学习(二)——决策树的实现
摘要:上一节对决策树的基本原理进行了梳理,本节主要根据其原理做一个逻辑的实现,然后调用sklearn的包实现决策树分类. 这里主要是对分类树的决策进行实现,算法采用ID3,即以信息增益作为划分标准进行 ...
- npm 基本命令的使用
1.npm -v 查看npm版本 2.使用npm命令安装模块 npm install Module Name 例如安装jquery模块 npm install jquery 3.卸载模块 npm un ...