Vue:不同页面之间的传递参数（二）---query

上一篇写的是关于params的传参问题，今天再补充一下query的情况

1） 在router文件下的index.js中，添加相关路径

routes: [
    {
      path: '/',
      name: 'Hello',
      component: HelloWorld
    },
    {
        path:"/paramsUrl",
        component:paramsUrl
    }
  ]

2） 在HelloWorld组件中传递参数，这里用的是点击事件跳转

this.$router.push({path:"/paramsUrl",query:{name:'Tom',age:18,sex:'male'}})

在paramsUrl组件中可以在url中看到

http://localhost:8080/#/paramsUrl?name=Tom&age=18&sex=nan

获取参数方法

this.$route.query

注意：如果在router中有那么参数，只需要将第二步中path替换成name即可