Vue-路由传值
在路由中传值有两种传值方式:
query查询参数传值
1.1 router-link的to属性或者js方式push方法里的参数由字符串更换成对象, 需要切换的路由由path字段负责, 传递的值由query字段负责
1.2 query方式传递的值会以键值对的形式拼接到网址的后面, 与get请求传递数据的格式类似
1.3 query方式传递的值, 刷新页面, 值不会消失
1.4 query方式传值, 不需要去配置routes数组里的对应对象
params路径参数传值
2.1 router-link的to属性或者js方式push方法里的参数由字符串更换成对象, 需要切换的路由由name字段负责, 传递的值由params字段负责
2.2 params方式传递的值会以路径的形式拼接到网址的后面
2.3 params方式传递的值, 刷新页面, 值会丢失
2.4 params方式传值, 需要去配置routes数组里的对应对象, 需要给对象多加一个name字段, 还需要将path字段修改成 “/路由/:值1/:值2/:…”
//传值 methods:{ goMyOrder(){ this.$router.push({name:"box", params:{id:"667788"}}).catch(err=>{}); } } //接收值 computed:{ getId(){ return this.$route.params.id } } //路由配置 { path:"Box1/:id", name:"box", component: ()=>import("../views/login/Box1") }
本文来自博客园,作者:前端小白银,转载请注明原文链接:https://www.cnblogs.com/forever-ljf/p/16687681.html