【Vue2】编程式路由导航

在Vue Router中，除了使用 创建 a 标签来定义导航链接之外，还可以使用Vue Router通过编写代码来实现导航.
他提供的三个实例方法：router.push、router.replace和router.go，使用起来相较于声明式导航更加灵活
这些方法都在VueRouter的原型对象上.这些方式都可以通过this.$router来访问到

router.push

• <rotuer-link to=" "></router-link>内部默认调用的是该方法。
• 该方法可以传入三个参数：
  • location跳转路由信息 参数与<rotuer-link to=" "></router-link>中的to一致
  • resolve成功回调
  • reject失败回调

  this.$router.push(location,($router)=>{
        
        ...},(err)=>{
        
        ...})
  // 对象携带参数的方式调用
  this.$router.push({
        
        
  	//path:"/search"  path与params不可以同时使用
  	name:'search',
  	params:{
        
        ...}，
  	query:{
        
        ...}
  },
  $router=>{
        
        },
  err=>{
        
        ...}
  )
  

  它会向 history 栈添加一个新的记录，当进行后退操作时会回到之前访问的路径。
  
  例如我们访问了:8080:/home/ -> :8080/home/search/ -> :8080/home/search?kw=abc -> :8080/abc/
  他就会把先访问的放在最下面，后访问的放在最上面，后退的时候就会后入先出，从上而下取出

router.replace

该方法与router.push唯一不同的地方就是通过该方法访问的路由会替换掉最新一个历史记录。

router.go

使用该方法可以操作浏览器在历史记录中的前进与后退，

• 当提供了一个大于0的正整数时，浏览器的路径会在history栈中向上移动对应的步数，
• 当提供了一个小于0的负整数时，浏览器的路径会在history栈中向下移动对应的步数
• 当提供了一个为0的参数时，浏览器会刷新页面
  下面是router.go的使用实例

  this.$router.go(1)  // 前进一个页面
  this.$router.go(0)  // 刷新页面
  this.$router.go(-1) // 后退一个页面