vue-router中query和params传参的区别

关注我的个人博客:https://pinbolei.cn，获取更多内容

$router 和 $route的区别

首先说一下 $router和 $route

this.$router 可操作路由对象，只写对象
this.$route 路由信息对象，只读对象

1.query

1.路由跳转

this.$router.push({
  path:'/user',
  query:{
    name:'abc',
    age:'11'
  }
})

2.接受参数

let name = this.$route.query.name;
let age= this.$route.query.age;

2.params

1.路由跳转

this.$router.push({
  name:'user',
  params:{
    name:'abc',
    age:'11'
  }
})

2.接受参数

let name = this.$route.params.name;
let age= this.$route.params.age;

总结

1.query相当于get传参，即在浏览器地址栏中显示参数。
2.params相当于post，即在浏览器地址栏中不显示参数，但是如果使用params传值的话，页面一刷新params 的值就会消失。