Closed lulujianglab closed 6 years ago
在vue中官网中我们可以看到两种页面间传值得方法:query和params
首先在路由文件中定义类似的如下路由
{ path:"/user", name:"user", component:user }
然后在页面中定义跳转路径和传值参数
this.$router.push({path:'/user',query:{userName:'ls',userId:'02'}});
我们已经了解了query传参会将参数都放到url中,所以当传递的值比较多的情况下,跳转的url会太长而受限制(取决于浏览器和服务器的限制)
所以只建议在参数较少的情况下使用query传值
参数不带入url中,可在参数较多时使用
同样的先在路由文件中定义类似的如下路由
console.log(this.$route.params.userName )
正确的写法
this.$router.push({name:'user',query:{userName:'ls',userId:'02'}});
在vue中官网中我们可以看到两种页面间传值得方法:query和params
query 跳转URL携带参数
首先在路由文件中定义类似的如下路由
然后在页面中定义跳转路径和传值参数
我们已经了解了query传参会将参数都放到url中,所以当传递的值比较多的情况下,跳转的url会太长而受限制(取决于浏览器和服务器的限制)
所以只建议在参数较少的情况下使用query传值
params
参数不带入url中,可在参数较多时使用
同样的先在路由文件中定义类似的如下路由
然后在页面中定义跳转路径和传值参数
问题来了,如果我们打印下面代码,结果肯定是 undefined
注意,这是因为使用params传值,只能用name来引入路由,可见官网
正确的写法
问题又来了,如果我们刷新页面,参数就不见了
注意,用params携带参数时,在注册