vue路由传参方式、区别

vue路由传参

比如有A、B 两个文件,A文件的数据要往B文件传递,这个时候就需要路由传参。

如何传参

首先找到A页面跳转到B页面的路由,在A文件路由上配置要传递参数

点击跳转到B页面

接下来找到B路由配置

{
      path: '/B/:id',
      name: 'B',
      component: appB
    }

最有在 B 页面接收数据

      created(){
          let ID= this.$route.params.id   //这个ID就是咋们 从A页面传递过来的数据
      }   

vue 有两种传参方式:

分别是 params 与 query;

区别

写法大致相同,在第一部配置的时候params用的是name、query用的是path、
query要用path来引入,params要用name来引入。
注意接收参数的时候,是router了!
query更加类似于我们ajax中get传参,params则类似于post

query:

params:

从上面俩张图片可以看到params的路径中是不显示参数的 反而query是把参数拼接到路由的后面

你可能感兴趣的:(vue路由传参方式、区别)