1、第一种是最为常用的,使用push跳转:
//字符串形式直接跳转 this.$router.push('/goods/add') //对象的形式进行跳转 this.$router.push({path:'/goods/add'}) //对象的形式并且带参数 this.$router.push({path:'/goods/add?url=123'}) this.$router.push({path: '/goods/add', query: {selected: "2"}}) 接受参数: //获取通过query带过来的参数对象 // console.log(this.$route.query)
2、第二种也是比较常见的,使用标签跳转:
<router-link to="/goods/add">点击跳转</router-link>
3、第三种是使用replace跳转:
//导航后不会留下 history 记录。即使点击返回按钮也不会回到这个页面。 this.$router.replace({path:'/goods/add'}); //带参数方式与push相同(获取参数也一样) this.$router.replace({path:'/goods/add', query: {selected: "3"}}); //push方法也可以传replace //push在加上replace: true后,它不会向 history 添加新记录,而是跟它的方法名一样 —— 替换掉当前的 history 记录。 this.$router.push({path: '/home', replace: true})
4、第四种是使用go方式跳转:
//跳转到上一页 this.$router.go(-1) //跳转到上上页 this.$router.go(-2)