首页 > 代码库 > Vue 参数传递及刷新后依旧存在
Vue 参数传递及刷新后依旧存在
获取参数方式有两种:
1、params
2、query
第一种方式: params
this.$router.push({name:‘Hello‘,params:{name:‘zs‘,age:‘22‘}});
name:组件中的命名
params 中两个参数分别为name,age
跳转 hello这个组件,获取参数值:
var name = this.$route.params.name;
var age = this.$route.params.age;
这样就会获取到相应参数
浏览器地址为
http://localhost:8080/#/hello/
问题来了 ,刷新参数不见了如何解决往下看
在router路由中有个path
.....
{ path:‘/hello/:name/:age‘, name:‘Hello‘, component: Hello }
这里要使用 /:name 如果有多个可以这样 /:name/:age/.......
这是浏览器 显示
http://localhost:8080/#/hello/zs/22
zs ,22就是值。
第二种方法:
query
跳转URL携带参数
this.$router.push({name:‘Hello‘,query:{name:‘zs‘,age:‘22‘}});
在组件中获取
var name= this.$route.query.name; var age = this.$route.query.age;
浏览器会显示
http://localhost:8080/#/?name=zs&age=22
两种方式都可以解决刷新参数不见问题。
跳转链接
Vue 参数传递及刷新后依旧存在
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。