Vue 路由器初学者指南

博观而约取,厚积而薄发。这篇文章主要讲述Vue 路由器初学者指南相关的知识,希望能为你提供帮助。
我们将研究如何使用 Vue Router 在 Vue 应用程序中实现路由。所以我们可以进行动手实践,我们将使用 Vue 和 Vue Router 构建一个简单的 Pokedex 应用程序。具体来说,我们将介绍以下内容:

  • 设置路由器
  • 路由参数
  • 声明式和程序化导航
  • 嵌套路由
  • 404 页
每个允许创建单页应用程序的 javascript UI 框架都需要一种将用户从一个页面导航到另一个页面的方法。所有这些都需要在客户端通过将当前显示在页面上的视图与地址栏中的 URL 同步来进行管理。在 Vue 世界中,管理此类任务的 [官方库] 是 Vue Router。
与以往一样,本教程的代码可以在??GitHub??上找到。
先决条件以下是必需的,以便您可以充分利用本教程:
  • html、CSS、javaScript 和 Vue 的基本知识。如果您知道如何使用 Vue 在页面上呈现某些内容,那么您应该能够跟进。对 API 有一点了解也会有所帮助。
  • 您的机器上安装了??Node.js??和??Vue CLI 。??我们将在本教程中使用 Vue 3,因此请确保更新 Vue CLI。
应用概览我们将构建一个 Pokedex 应用程序。它将包含三个页面: