vuerouter4报错：Discarded invalid param(s) “name“, “age“ when navigating.

最新推荐文章于 2024-03-01 16:55:20 发布
最新推荐文章于 2024-03-01 16:55:20 发布
阅读量1.1w 收藏 7
点赞数 2
分类专栏： vue 文章标签： 前端 vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38666931/article/details/111308803
版权
本文探讨了在使用Vue Router进行页面跳转时遇到的问题：通过params传递参数却无法获取的情况。解析了Vue Router v4.14版本后对未定义params的新限制，并提供了解决方案。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

bug描述：

从A页面跳转到B页面，在将A页面的某些参数以【路由组件参数】的方式准备携带到B页面，由于希望该参数不出现在地址栏中，所以用了params而不是query，然后报了这个错。

router.push({ name: '路由名称', params: { 参数1，参数2 }})

查看官方文档，没有说明这个情况。

 后来看到的github中提到版本的更新问题

 在版本4.14后，未在路由文件中定义的params，是不能按照这种方式使用的。

参考链接：vue-router - vue3中params跳转到的页面拿不到params的值? - SegmentFault 思否

Vue3 使用 Vue Router 时，prams 传参失效和报错问题
专注基础架构领域
07-12 951
我尝试使用 prams 传递数据当我跳转页面时,得到的 prams 数据为空 ,控制台也出现了 Vue Router 的警告点开链接后发现了原因,。也就是说，从Vue Router的2022-8-22 这次更新后，我们使用上面的方式在新页面无法获取：vue也给我们提出了解决方案：使用 query 的方式传参只要改成query 传参就好了,注意query传参只能用路由表中的 path ,不是 name ,并且所有参数都会显示在URL 地址上。将参数放在 pinia 或 vuex仓库里。
【Docker】WARNING: Published ports are discarded when using host network mode
九师兄
07-01 4278
1.概述 写了一个docker命令如下 (base) lcc@lcc grafana-storage$ docker run -d -p 9100:9100 -v "/proc:/host/proc:ro" -v "/sys:/host/sys:ro" -v "/:/rootfs:ro" prom/node-exporter WARNING: Published ports are discarded when using host network mode ab2abeabf45c271e67.
[Vue Router warn]: Discarded invalid param(s) “id“ when navigating. Seexxxxxxxfor more details
热门推荐
柑橘乌云_
04-03 1万+
当我 在vue3 组合式api中尝试使用name+params去路由跳转并传递参数的时候，出现警告信息，并且接收不到params的参数。只要改成query 传参就好了,注意query传参只能用路由表中的 path ,不是 name ,并且所有参数都会显示在URL 地址上。4.[传递 state，在新页面使用 History API 接收参数](#使用 History API 方式传递和接收)在跳转前的页面使用 state 参数：a跳转b。，如果使用使用了这种动态路由匹配方式，使用 query 的方式传参。
Discarded invalid param(s)“msg”when navigating
千万亿
10-26 1万+
路由跳转时出现报错：Discarded invalid param(s) "msg" when navigating
router利用params传值时出现[Vue Router warn]: Discarded invalid param“xx“when navigating
qq_51389038的博客
10-11 809
router利用params传值时出现[Vue Router warn]: Discarded invalid param"xx"when navigating
Discarded invalid param(s) “myname“ when navigati
fivestar2009的博客
08-31 3179
vue-router版本不对，造成接收不到router的参数
vue3页面跳转遇到 Discarded invalid param(s) “message“ when navigating
jdhrucn的博客
07-31 2827
后来我查找了一下资料，发现从Vue Router的2022-8-22 这次更新后，我们使用上面的方式在新页面无法获取。vue Router也提供了解决方法。query传参是可以正常传参数的，但是传的参数会显示在url地址栏上。我在使用useRouter时，发现使用params传参，会使得跳转的页面接受不到参数，会报错，显示。最近写了一个vue3的项目，在使用路由跳转的时候发现了一个问题，记录分享一下。这样你就可以正常的接受参数了。代码如下：页面a跳转到页面b。这个错误，无效参数。
django-celery报错：The message has been ignored and discarded. Did you remember to import the module
u012390023的博客
07-18 1212
django-mycelery无法识别应用中的模块 所以需要在mycelery配置中对django进行初始化 # 把celery和django进行组合，识别和加载django的配置文件 os.environ.setdefault("DJANGO_SETTINGS_MODULE", "mysite.settings.dev") # 在当前celery中启动django框架，对django框架进行初始...
【问题记录】运行python+selenium程序报错，NoSuchWindowException: Browsing context has been discarded
qq_42186276的博客
05-10 2636
看了看网上的解决方法，没有找到什么具体有效的办法，所以重装了一下selenium，不知道有没有用。
netty : io.netty.handler.codec.TooLongFrameException
九师兄
09-08 1065
背景 做netty权威指南的私有协议开发，案例报错如 io.netty.handler.codec.TooLongFrameException: Adjusted frame length exceeds 1048576: 795898487 - discarded at io.netty.handler.codec.LengthFieldBasedFrameDecoder.fail(LengthFieldBasedFrameDecoder.java:501) at io.netty.handler.
Vue3中路由传值使用params传值失败报错
qq_50917663的博客
08-11 2306
在我们使用Vue3中用到params传值时，发现传值失败，并给出一个报错Discarded invalid param(s) "XXX" when navigating.2、使用 History API 方式传递和接收（我认为很方便的一个方法）首先声明下我只是菜鸟，记录一下问题，能帮到你最好，互相学习。就可以拿到值，并且刷新时数据不会丢失。1、使用query进行传值，
【Vue-Router】使用 prams 路由传参失效
小秀的博客
08-14 1343
报错信息： [Vue Router warn]: Discarded invalid param(s) “name”, “price”, “id” when navigating.// name 对应 router 的 name。所以，这种使用 prams 路由传参的方法失效。// 不会展示在URL上，存在于内存里。此时得到的 params 数据为空。
vue3路由跳转传参方式
最新发布
qq_55545630的博客
03-01 3364
我先简述一下我为啥推荐暴露传参而不推荐隐蔽传参。首先，虽然history API能解决刷新页面丢失数据的情况，但仅限于当前tab页，因为参数是保存到当前tab页的history中。所以会有一个神奇的现象，那就是你复制了当前的url，想打开一个新tab页，然后发现没有参数了。其次，也算是我的一个疑问，希望能蹲到一个大佬为我指点一下迷津。我一直不理解前端跳转页面，为啥传个参数还要遮遮掩掩的，感觉也就传个id啥的就够了，其他信息直接到新页面拉接口获取不就行了，也不涉及什么敏感信息的。
4005—Vue 3.x随笔
zhang_yling的专栏
05-27 471
一、安装 通过npm安装相应的包，如果存在vue2.0的包，需要首先npm uninstall进行卸载，再安装。 一个朴素的vue 3的环境包如下图： 通过脚手架建立项目与vue2.0有所不同，如下 版本 构建命令 运行项目 Vue2.X vue init webpack <项目名称> npm run dev Vue3.X vue create <项目名称> npm run ...
three.js 的动画，不同设备的动画效果不同。
jdhrucn的博客
03-17 264
在做项目时，加载模型之后，给位移动画效果时，在我自己的电脑上没问题（自己电脑配置不好）。但是在我们公司的电脑上（配置比较好）会出现位移不到指定的位置。一开始我自己也是满头雾水，这不是硬件方面的问题吗?，再渲染期间，他是要不停的调用的，硬件好的电脑你不会出现掉帧的问题，也就是画面可以很流畅的执行并到达指定位置，硬件不好的就眼泪直流。近期在做vue3加three.js的项目时，遇到一个问题，记录一下。的调用次数减少，这样就会是两台电脑达到相差无几的效果。最后还是我们组里的大佬解决了。自己的部分代码，仅供参考。
Vue-Router4 学习记录
liuzhe的博客
12-04 1205
vue-router4使用记录，萌新用。
vue2升级vue3踩坑记录（二）mixins 和 vue-router
weixin_43938253的博客
11-29 1572
Ant Design of Vue的V2版本表单校验和vue-router 4.1.6版本的填坑记录
解决Vue Router4中params 传参失效和报错问题
LP'S Blog
02-27 6216
在使用vue-router4中params 进行路由组件之间传参，跳转页面接收不了并出现如下错误如下是我的代码传输页面接收页面。
docker compose 启服务时报错Published ports are discarded when using host network mode
07-12
这个错误通常是因为在使用 Docker Compose 启动服务时，使用了 host network 模式。在 host network 模式下，容器与主机共享网络命名空间，容器中的端口直接映射到主机上，因此无法使用 published ports 属性来指定...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值