vue 路由跳转页面

要在 Vue 中进行路由跳转，需要使用 Vue Router。以下是一个基本的路由跳转示例：

1. 首先，在 main.js 中导入 Vue Router 并创建路由实例：

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const router = new VueRouter({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/about',
      name: 'About',
      component: About
    }
  ]
})

在这个示例中，我们创建了两个路由：一个是指向根路径 `/` 的 Home 组件，另一个是指向 `/about` 路径的 About 组件。

2. 然后，在需要进行路由跳转的组件中，使用 `router-link` 标签来创建跳转链接：

<template>
  <div>
    <router-link to="/">Home</router-link>
    <router-link to="/about">About</router-link>
  </div>
</template>

在这个示例中，我们创建了两个链接：一个是指向根路径的 Home 组件，另一个是指向 `/about` 路径的 About 组件。

3. 最后，在需要进行路由跳转的组件中，使用 `router.push` 方法来进行跳转：

methods: {
  goToAboutPage() {
    this.$router.push('/about')
  }
}

在这个示例中，我们定义了一个 `goToAboutPage` 方法，当该方法被调用时，会使用 `$router.push` 方法来跳转到 `/about` 路径。

以上就是一个基本的 Vue 路由跳转示例。