如何通过vue-router代码示例实现编程式导航？

本文共计697个文字，预计阅读时间需要3分钟。

为了简化上述内容，以下是一个简短的版本：

通过使用`router-link`创建`a`标签定义导航链接，我们可以利用`router`实例的`push`方法来动态实现路由跳转。具体方法是通过编写JavaScript来调用`this.$router.push(location, onCom)`实现导航链接。

除了使用 <router-link> 创建 a 标签来定义导航链接，我们还可以借助 router 的实例方法，通过编写代码来实现。即：通过js动态的进行导航链接。

一、this.$router.push( )

router.push(location, onComplete?, onAbort?)

注意：在 Vue 实例内部，你可以通过 $router 访问路由实例。因此你可以调用 this.$router.push。

想要导航到不同的 URL，则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL。

当你点击 <router-link> 时，这个方法会在内部调用，所以说，点击 <router-link :to="..."> 等同于调用 router.push(...)。