vue中通过路由跳转的三种方式
router-view 实现路由内容的地方,引入组件时写到需要引入的地方 需要注意的是,使用vue-router控制路由则必须router-view作为容器。
通过路由跳转的三种方式
1、router-link 【实现跳转最简单的方法】
-
<router-link to=需要跳转到的页面的路径>浏览器在解析时,将它解析成一个类似于<a> 的标签。
2、this.$router.push 常用于路由传参,用法同第三种
区别:
- query引入方式
params只能用name来引入路由 而query 要用path引入
- query传递方式
类似于我们ajax中get传参,在浏览器地址栏中显示参数 params则类似于post,在浏览器地址栏中不显示参数
举例:
this.$router.push({ path: /rental-list/transfer, query: { id: this.roleId, ids: this.checkList }
在跳转的页面,即路径为rental-list/transfer的页面接收参数
let id = this.$route.query.id //接收id3、this.$router.replace{path:‘/’ }类似,不再赘述