Vue Router 的params和query传参的使用区别

1·params传递参数（使用 name 跳转）

//$router : 是路由操作对象，只写对象
//$route : 路由信息对象，只读对象

//操作 路由跳转
this.$router.push({
      name:'one',
      params:{
          name:'pendy',
          age:'11'
     }
})

//读取 路由参数接收
this.name = this.$route.params.name;
this.age = this.$route.params.age;

 

2·query传递参数 （使用 path 跳转，前面要加 "/"）

//query传参，使用path跳转
this.$router.push({
    path:'/second',
    query: {
        queryId:'20180822',
        queryName: 'query'
    }
})

//query传参接收
this.queryName = this.$route.query.queryName;
this.queryId = this.$route.query.queryId;

调试时记得你要从跳转的入口路径进行刷新，