今天实现美食杰个人主页的效果用到了query传参的方法
那么接下来我会叙述一下query和params的区别
query语法:

this.$router.push({path:"地址",query:{id:"123"}}); 这是传递参数

this.$route.query.id; 这是接受参数

params语法:

this.$router.push({name:"地址",params:{id:"123"}}); 这是传递参数

this.$route.params.id; 这是接受参数

通过两者的语法我们可以看出来一点区别
1.写法的不同

query的语法用于path编写传参地址
params的语法用于name编写传参地址

2.接受方式不同

接受参数的时候用this.$route.params.name或者this.$route.query.name

3.两者中query在刷新页面的时候参数不会消失 但params在刷新页面的时候参数会消失 可以考虑本地存储解决此问题

4.query传过来的参数会显示到地址栏中 而params传过来的参数不会显示到地址栏中 直白的来说 query相当于get请求,而params相当于post请求

ps:可能我写的不是很详细 或者有所缺少 欢迎补充 非常感谢

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐