bug（警告）：[vue-router] Duplicate named routes definition: …

最新推荐文章于 2024-05-06 17:22:44 发布
最新推荐文章于 2024-05-06 17:22:44 发布
阅读量1.1k 收藏
点赞数 2
分类专栏： bug 文章标签： vue.js bug 前端 router
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45796592/article/details/137635149
版权

  •  查看警告：[vue-router] Duplicate named routes definition——翻译[vue-router]重复命名路由定义

  • 小编劝诫：当我们在开发过程中警告也一定不要忽略，虽然你在本地跑代码时这些警告影响项目的正常运行，但是会让你产生误区，让你觉得这么写是没有问题的，从而养成让你代码不规范的习惯；并且当下次因为这个警告而出问题时，你也会自动的忽略它，花费更多的时间找问题
  • 例如该警告：多个路由组件重名，它是可能会造成路由重定向或者导航时的混乱，因为Vue Router无法正确地确定应该激活哪一个路由，还有就是我们后台项目常常需要通过权限限制路由组件的展示，所以需要确保应用中每个路由的名称name都是唯一的
  • 解决方案：不管是静态定义路由还是动态渲染时，一定需要保证我们的name唯一

❆VE❆
关注
专栏目录
路由重复：Duplicate named routes definition: { name: “settings“, path: “/settings/“ }
法外狂徒张三
08-30 966
遇见的问题 解决方法 代码： // 重置路由 export function resetRouter() { const newRouter = createRouter() router.matcher = newRouter.matcher // 重新设置路由的可匹配路径 } 然后我们调用这个方法 import { resetRouter } from '@/router' // 退出的action操作 logout(context) { // 3. 重置路由 resetRouter
控制台警报：[vue-router] Duplicate named routes definition: { name: “xxx“, path: “xxx“ }
q1ngqingsky的博客
12-09 915
vue-router控制台警报 第二个问题：子路由已经有相应的路由名字，父组件
vue 路由警告 Duplicate named routes definition
热门推荐
嗝~
04-21 6万+
今天在开发的时候，项目报了一个警告Duplicate named routes definition ，这里记录一下解决方式和思路。 警告产生的原因 根据提示内容，我们大概猜测是和路由的name有关，上网了解了一下，验证了我们的猜测是正确的。警告是由于路由的name 重复导致的。（原理？who care (艹皿艹 )） 错误类型 虽然我们已经知道警告是由于name重复导致，其实细分一下还是有点不一样的。 一是静态路由中的name重复，一是动态路由的name 重复 举例说明 静态路由： ..
[vue-router] Duplicate named routes definition: { name: “XXX“, path: “XXX“ }
LizequaNNN的博客
10-08 1万+
[vue-router] Duplicate named routes definition: { name: “XXX”, path: “XXX” } 一、分析原因 翻译过来就是：定义重复命名的路由。 言外之意就是，与之前命名过该路由名称的路由发生了冲突，所以Vue发出警告。 那为什么是警告？有部分开发人员又或是新手小白觉得，只要不是报bug，那我就不管了，不想浪费自己时间。当你有这种想法的时候你该庆幸你不是在我的团队里，不然我就梆梆给你来两下。 首先查看警告详情： 点进去看看。 找到报warnin
vue中报这个警告：[vue-router] Duplicate named routes definition: { name: “XXX“, path: “XXX“ }
最新发布
飞翔༒之翼
05-06 784
解析：Vue先判断新创建的路由是否有name属性，当有name属性的时候，如果新的name不在nameMap里面，那就把新的name添加到record里面并且赋值nameMap为更新后的record。否则，且在非生产环境下，就会报warning，这时候就会看见我们开头时候的那个警告。找到报warning的位置了，看了一下，这里的意思就是：如果不是生产环境下，那我就给你报这个warning。言外之意就是，与之前命名过该路由名称的路由发生了冲突，所以Vue发出警告。翻译过来就是：定义重复命名的路由。
[vue-router] Duplicate named routes definition
业余前端的职业经历
02-16 3052
表示路由中出现了重名的路由 笔者出现这个原因是 使用动态路由加载了俩个 name:"home" name:"home"的情况
[vue-router] Duplicate named routes definition动态路由addRoutes的踩坑
几百块的博客
11-25 1634
踩坑记录：[vue-router] Duplicate named routes definition动态路由addRoutes的坑 问题描述： 第一次进入页面，左侧静态路由和动态路由列表均能正常显示，！但点击左侧其他路由后浏览器报警告[vue-router] Duplicate named routes definition…,并且跳转失败 动态路由的概念： 一般来说是通过后端接口返回拿到数据，不同人不同权限，返回的数据也不同。然后在路由守卫router.beforeEach 中进行添加路由 解决方案：
vue-router之解决addRoutes使用遇到的坑
11-20
最近项目中使用了vue-router的addRoutes这个api，遇到了一个小坑，记录总结一下。 场景复现： 做前端开发的同学，大多都遇到过这种需求：页面菜单根据用户权限动态生成，一个常见的解决方案是： 前端初始化的时候，...
[vue-router] Duplicate named routes definition:
01-27
在Vue Router中，如果定义了重复的路由名称，就会出现"Duplicate named routes definition"的警告。这个问题通常出现在使用`addRoutes`方法动态添加路由时。 解决这个问题的方式有两种： 1. 确保每个路由的名称都是...
VUE 路由警告 Duplicate named routes definition
Cokeandsprite的博客
01-31 3999
控制台路由警告，虽然无伤大雅，但强迫症，迫使我来解决掉他。
vue 路由报[vue-router] Duplicate named routes definition
Xbackhebe的博客
03-18 1155
如果动态路由中存在重复的路由名字，可以在生成动态路由时为每个路由设置一个唯一的name属性，以避免路由名字重复的问题。在生成动态路由时，可以根据路由信息动态生成唯一的name属性。
[vue-router] Duplicate named routes definition: { name: “XXX“, path: “/XXX“ }
初心不改
09-22 2528
Vue浏览器提示路由重定义，未加重定向的原因。 const routes = [ { path: '/', redirect: { name: 'Home' } }, { path: '/', name: 'Home', component: Home, children: [ { path: '/index', name: 'Index', component: ()
Duplicate named routes definition
lmp5023的博客
04-07 4968
初始化后台菜单的时候报了一堆Duplicate named routes definition， 原因：没有判断addRoutes是否成功，以下为正确逻辑：判断vuex中是否存在menus，当存在之后就不用再addroutes了，不存在则去添加，如果不判断，则每次进来页面都去addroutes导致name重复了，而且不停的循环addroutes。 参考地址：vue 路由警告 Duplicate named routes definition_白日有梦的博客-CSDN博客 ...
Duplicate named routes definition:
有问题可关注公众号：前端研究院 后台输入问题回复
11-24 2473
[vue-router] Duplicate named routes definition: { name: "模板", path: "/exam/" } 这里警告的意思是说重复命名路由，在路由配置文件中，找到对应name，会发现有两处或者两处以上都使用了“模板”这个name； 解决办法：直接删除获取修改name使其具有唯一性即可。 ...
Duplicate named routes definition: { name: “[object Object]“, path: “/experienceFillUpload“ }
m0_46183615的博客
03-29 511
路由name命名重复问题： 问题描述： Duplicate named routes definition: { name: “[object Object]”, path: “/experienceFillUpload” } (重复的命名路由定义) 解决方案一： 在路由配置文件中，找到对应name，如果发现有两处或者两处以上都使用了“模板”这个name； 直接删除获取修改name使其具有唯一性即可。 解决方案二： 检查name的值是否是‘字符串’，如果如图没有‘’则作为变量，因此找不到变量就会报错 则加
[vue-router] Duplicate named routes definition: { name: “settings“, path: “/settings/“ }路由重复
weixin_48837605的博客
09-08 752
产生的原因:退出系统,在今日的时候会报路由重复的警告,刷新信息的时候是没有的,因为这使用router.addRoutes动态添加路由,退出系统的时候并没有清除动态路由,所以会报错误 效果: 解决方式:退出项目系统的时候清空路由 在router的index.vue中已经定义了方法: // 清除动态路由 export function resetRouter(){ const newRouter= createRouter() router.matcher = newRouter.matcher /
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值