vue3跳转路由

在Vue3中，使用Vue Router进行路由跳转的方法与Vue2相同。

首先，在Vue3项目中安装Vue Router：

npm install vue-router@next

然后，在项目的入口文件中，引入Vue Router并创建路由实例：

import { createRouter, createWebHashHistory } from 'vue-router'

const router = createRouter({
  history: createWebHashHistory(),
  routes: [
    // 定义路由
  ]
})

接下来，可以定义路由：

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

其中，path表示路由的路径，name是路由的名称，component是路由对应的组件。

最后，在需要跳转路由的地方，可以使用router.push()方法进行跳转：

<template>
  <button @click="goToAbout">Go to About</button>
</template>

<script>
export default {
  methods: {
    goToAbout() {
      this.$router.push('/about')
    }
  }
}
</script>

在Vue3中，可以使用$router访问路由实例，然后调用push()方法进行路由跳转。