编程式导航

除了使用 router-link 创建 a 标签来定义导航链接，

还可以，借助路由实例（ router / this.$router ）的实例方法，通过编写代码（ 即，编程式导航 ）来实现。

• router.push(location)  导航到不同的 URL

该方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL

声明式	编程式
<router-link :to="...">	router.push(...)

• 该方法的参数，可以是一个字符串路径，或者一个描述地址的对象。例如：

# 字符串
  router.push('home')

# 对象
  router.push({ path: 'home' })

# 命名路由
  const username = 'webpiece'
  // 我们可以手动建立 url，但我们必须自己处理编码
  router.push(`/user/${username}`) // -> /user/webpiece
  // 同样
  router.push({ path: `/user/${username}` }) // -> /user/webpiece
  // (推荐) 如果可能的话，使用 `name` 和 `params` 从自动 URL 编码中获益
  router.push({ name: 'user', params: { username } }) // -> /user/webpiece
  // `params` 不能与 `path` 一起使用
  router.push({ path: '/user', params: { username } }) // -> /user

# 带查询参数，变成 /register?plan=private
  router.push({ path: 'register', query: { plan: 'private' }})

• router.replace(location)  无痕浏览，替换当前位置

跟 router.push() 很像，唯一的不同就是，它不会向 history 添加新记录，而是替换掉当前的 history 记录

声明式                 　　　　　　　　　　编程式
<router-link :to="..." replace>     router.replace(...)

# 也可以直接在传递给 router.push 的 routeLocation 中增加一个属性 replace: true 
  router.push({ path: '/home', replace: true })
  // 相当于
  router.replace({ path: '/home' })

• router.go(n)

参数 n 是一个整数，意思是：在 history 记录中，向前或者后退多少步，类似 window.history.go(n)

// 在浏览器记录中前进一步，等同于 history.forward()
   router.go(1)

// 后退一步记录，等同于 history.back()
   router.go(-1)

// 前进 3 步记录
   router.go(3)

// 如果 history 记录不够用，就静默失败
   router.go(-100)
   router.go(100)