1、前言
vue-router的路由跳转时传递参数有两种方式：
1. 一种是路由参数，通过定义动态路由传递参数
2. 另一种是通过query来传递参数
再者，已知的路由跳转有两大类：
一类是<router-link>组件的to跳转
二是通过编程式导航，通过js命令进行跳转
那么，两种传参方式，两种跳转方式就会有四种搭配写法
2、动态路由传参
动态路由传参就是通过params进行传参
动态路由传参说明：
1. 动态路由params参数的路由定义格式 /router/:id
2. 在跳转路由时 id 的部分是动态变化的，例如：/router/1，传递的数据就是 1
3、通过<router-link>组件的to属性传参
但是在跳转路由的时候就有不一样的地方，通过<router-link>组件跳转时，可以使用或不使用动态绑定to属性
3.1. <router-link>组件不使用动态绑定to属性
3.2. <router-link>使用动态绑定 to 属性
4、通过命名路由跳转
在动态绑定 to 属性时，也可以通过命令路由的跳转方式
5、通过编程式导航传参
编程式路由导航传参就是通过在方法中，添加点击事件加入参数，利用 this.$router.push()或this.$router.replace()去跳转页面。
5.1 通过命名路由跳转
其实，params传递的参数是有限的，通常来说就是一个字符串或者一串数字，但是如果希望传输的数据更多呢？那么就要用到query传参的方式去传递数据了。
6、query传参
query传递数据的方式：首先query方式传递数据，路由的配置就是普通路由配置/router，如果有其他特殊情况另说，传递参数的方式，跳转路由时动态绑定的对象中使用 query 的key作为传递方式。
6.1、开发需求示例
需求分析：当我们点击不同的作者，要将作者的姓名，以及不同作者的不同作品传递到组件中，这样就用到了路由传参
因测试的结果不便用图片形式展示，因此暂时使用的是一个gif录屏软件录制的
6.2 标签跳转的方式
此时需注意，如果使用在<router-link>组件进行路由跳转时传递query参数，那么to属性只能通过动态绑定的方式传递。
此时动态绑定的to属性中，name是通过命名路由进行跳转的，params是在跳转路由时，处理导航文字，因为只有匹配成功的导航才会有router-link-active类名，query就是我们在跳转路由时，需要向组件中传递的所有数据。
6.3 编程路由跳转
