vue中如何跳转页面

在Vue中，可以使用Vue Router来进行页面间的跳转。下面是一个简单的示例：

首先，确保你已经安装了Vue Router插件。可以通过npm或yarn进行安装：

npm install vue-router

或者

yarn add vue-router

然后，在你的Vue项目中创建一个路由文件，比如命名为`router.js`。在该文件中，导入Vue和Vue Router，并创建一个新的路由实例。定义路由规则，即URL路径与组件之间的映射关系。示例代码如下：

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

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: About
  }
]

const router = new VueRouter({
  mode: 'history',
  routes
})

export default router

在上面的示例中，我们定义了两个路由规则：一个是根路径`/`对应的组件是`Home`，另一个是`/about`路径对应的组件是`About`。

接下来，在你的Vue组件中，使用`<router-link>`组件来生成跳转链接，使用`<router-view>`组件来显示对应的组件内容。示例代码如下：

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

    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

在上面的示例中，我们使用了`<router-link>`来生成两个跳转链接，分别指向根路径和`/about`路径。当用户点击这些链接时，Vue Router会自动切换到对应的组件，并通过`<router-view>`来显示该组件的内容。

这样，你就可以在Vue中进行页面间的跳转了。当用户点击链接时，URL会发生改变，对应的组件会进行加载和显示。