0


Vue Router不要再使用params传参了,params获取不到参数,官方删除params传参

问题描述

之前说过,vue路由传参有两种方式,分别是

  1. query

  1. params

;query是明文,params是隐藏的;
今天在使用params的时候发现获取不到参数了

我的写法:
1、 路由配置:

  1. {path:'/about',name:'about',component:About
  2. },

2、跳转:

  1. this.$router.push({name:'about',params:{id:1}})

3、接收:

  1. console.log(this.$route.params);

4、结果:
得到一个警告和空对象
在这里插入图片描述

原因

查看链接4.1.4更新日志发现官方做了删除替代,那这样的话,这种方式就不能使用了,可以通过pinia(vuex)等进行传递

在这里插入图片描述

params的正确用法

本身params的定义是为了给动态路由使用的,比如
1、 路由配置:

  1. {path:'/about/:id',name:'about',component:About
  2. },

2、跳转:

  1. this.$router.push({name:'about',params:{id:1}})

或者

  1. this.$router.push({path:'/about/1',})

3、接收:

  1. console.log(this.$route.params);

4、结果:
在这里插入图片描述


本文转载自: https://blog.csdn.net/lhkuxia/article/details/126832654
版权归原作者 苦夏木禾 所有, 如有侵权,请联系我们删除。

“Vue Router不要再使用params传参了,params获取不到参数,官方删除params传参”的评论:

还没有评论