Vue 参数传递及刷新后依旧存在
2024-08-30 02:10:20
获取参数方式有两种:
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
两种方式都可以解决刷新参数不见问题。
最新文章
- node(async原理)
- struts2表单批量提交
- web系统架构设计中需要知道的点(前端篇)
- myeclipse+tomcat 工程名改名的问题 ——————完美解决方案
- win 10 远程连接出现 ";由于安全设置错误, 客户端无法连接到远程计算机. 确定你已登录到网络后.” 错误
- AI - Ideas
- CM 部署bigdata测试环境群集机器报错
- 【HDOJ】1963 Investment
- java实现的可以无限级别添加子节点的菜单树
- hdoj 2546 饭卡(0-1背包)
- Android官方技术文档翻译——Gradle 插件用户指南(1-3)
- Java-继承的应用
- 如何在网页标题栏title加入logo图标?
- 设置SecureCRT的背景色和文字颜色方案
- User authentication in Django(用户认证)
- TextInputLayout输入框验证
- Java 通过get post 请求url
- Expo大作战(八)--expo中的publish以及expo中的link,对link这块东西没有详细看,大家可以来和我交流
- 【Alpha 冲刺】 4/12
- A · F · O —— JLOI2018翻车记(附Day1简要题解)