千锋教育前端Vue3.0全套视频教程（Kerwin2023版，Vue.js零基础

在vue项目中我们经常需要跳转页面，大多数情况下跳转页面，也不仅仅是单一的跳转，而是需要携带参数，在跳转后的页面去渲染和使用，除了存进全局状态管理方法外，还有一种较为简单便捷的方式能够实现我们在跳转后的页面拿到跳转前的数据，那就是动态路由。

动态路由顾名思义是一种路由跳转，加上了动态的意思就是指它能够携带参数并跳转。

具体方法如下：

第一种，在路由表中配置需要跳转的路由路径，并在路径最后添加斜杠/:params，params是跳转时要携带的参数变量，可以换成其他变量名

在页面中给触发事件或函数中用router.push()进行跳转，在参数的路径中后面直接拼接需要携带的参数，或者变量

在跳转后的页面中用$route.params进行接收,接收的变量名是路由表中拼接的变量名"params“

第二种，同样在路由表中写好路由信息，添加上动态路由参数变量，在$router.push()的参数中传递一个对象参数，对象里写路由名称name字段书写路由名称和params对象中书写跳转携带的参数

以上两种是动态路由中的params传参，在浏览器地址栏中呈现成“路径/参数”的形式

还有一种是原生js中提供的路由跳转传参方式，querry传参，与vue中提供的方法有所区别的是不用再在路由表配置项的路径中拼接冒号参数名，直接使用router.push()跳转，在获取参数时不再使用$route.params获取参数，在querry传参中使用$route.querry来获取参数。除此之外的不同点是浏览器地址栏中是以"路径名?参数1&参数2”的查询字符串形式来呈现的