Query和params的区别？

今天实现美食杰个人主页的效果用到了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：可能我写的不是很详细或者有所缺少欢迎补充非常感谢

Query和params的区别？相关推荐

query和params的区别
query和params的区别 query params 这两个都是跳转url的时候传递参数.query可以用name和path来传递,但是params只能用name来传递,query是直接在url中 ...
vue路由query和params的区别
需要跳转的路由地址 {path: "/common",name: "Common",component: resolve =>require([" ...
@query传参_VueRouter之query与params两种传参区别
传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,比如传个id获取个详情信息,今天咱们就来看看Vue中是怎么实现这种传递参数得在Vue中提供了两种方法来进行路由传参:query 和 ...
query和params传参区别
query和params传参区别传参可以使用params和query两种方式 params传参只能用name来引入路由 query传递显示参数(url那里),params传递不显示参数,参数在请求体 ...
query和params传参的区别
一.query和params传参的区别 1.query传递显示参数,params传递不显示参数,params相对于query来说较安全一点取值方法也有不同 1.query取值:this.route. ...
vue路由传参两种方式；vue路由传参query与params区别；vue路由跳转的带参与不带参,路由跳转传参方式：name 、 path；
vue项目的路由传参常用的有两种方式:query和params 1.query传参特点:1.1可以用path也可以用name传递路径注意name是路由页面vue文件的名称不需要/1.2跳转页面地址 ...
@query传参_vue-router中params传参和query传参的区别及处理方法
在 Vue 实例内部,你可以通过 $router 访问路由实例.因此你可以调用 this.$router.push 想要导航到不同的 URL,则使用 router.push 方法.这个方法会向 his ...
vue-router传参的坑（query和params）
1.query方式传参和接收参数传参: this.$router.push({path:'/xxx'query:{id:id}})接收参数: this.$route.query.id 注意:传参是t ...
辉太郎看前端(query和params)
前言 query和params都是一种传参方式,只是有些许不同而已. 在说两者之前,我们首先要知道$router和$route的是什么. $router和$route $router 是路由操作对象, ...

Query和params的区别？

Query和params的区别？相关推荐

最新文章

热门文章