1、vue-router 参数传递

一般的开发中，我们希望点击某组件的时候，跳转的内容区页面会收到一些参数，这就涉及到路由的参数传递。
vue-router传递参数的方式主要有2种：

1. params传递
   先在路由规则配置的对象{}中，定义一个变量，例如
   const routes = [ { path:"/home/:name", component:Home}];
   随后，在Home.vue组件模板中，定义这个变量的实体
   export default { data(){ retrun { userId: this.$route.params.name }} }
   注意：$route返回的是当前URL对应的路由规则对象{ path…}
   其次，再把这个从$route拿到的数据name和Home.vue组件的userId数据进行绑定,在home.vue中：
   <router-link v-bind:to="'/user/'+ userId" tag="button">首页</router-link>
   这样写，如果home.vue内的数据发生改变，那么url也会改变

2. query传递
   不需要在routes规则对象里面，进行额外的参数添加；
   直接在home.vue中绑定一个对象，里面具有query属性，例如：
   <router-link v-bind:to="{ path: '/profile', query: { name:'ccc', age: 18} }" tag="button">首页</router-link>
   然后，在profile.vue中使用它，即
   this.$route.query.name/age

注意，query的传递是通过URL的方式，将query对象传给子组件