vue 路由跳转页面

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

首先，在 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 组件。

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

<template>
<div>
<router-link to="/">Home</router-link>
<router-link to="/about">About</router-link>
</div>
</template>
登录后复制
在这个示例中，我们创建了两个链接：一个是指向根路径的 Home 组件，另一个是指向 /about 路径的 About 组件。

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

methods: {
goToAboutPage() {
this.$router.push('/about')
}
}
登录后复制
在这个示例中，我们定义了一个 goToAboutPage 方法，当该方法被调用时，会使用 $router.push 方法来跳转到 /about 路径。
以上就是一个基本的 Vue 路由跳转示例。