vue3router

Vue 3的路由器使用与Vue 2的路由器(Vue Router)略有不同，以下是Vue 3中使用Vue Router的一些基本步骤：

1. 首先，在项目中安装Vue Router。你可以使用npm或yarn来安装，具体命令如下：

npm install vue-router@4

或

yarn add vue-router@4

2. 创建一个新的路由器实例。在你的项目中创建一个新的文件（通常命名为router.js或index.js），然后导入Vue和Vue Router，并创建一个新的路由器实例。示例代码如下：

import { createRouter, createWebHistory } from 'vue-router';
import Home from './views/Home.vue';
import About from './views/About.vue';

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

const router = createRouter({
  history: createWebHistory(),
  routes
});

export default router;

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

3. 在主Vue实例中使用路由器。在你的主Vue实例中导入路由器实例，并将其作为选项之一进行注册。示例代码如下：

import { createApp } from 'vue';
import App from './App.vue';
import router from './router';

const app = createApp(App);
app.use(router);
app.mount('#app');

在上面的示例中，我们通过app.use()方法将路由器实例注册为Vue应用的插件。

至此，你已经成功地设置了Vue 3的路由器。你可以在组件中使用 `<router-link>` 组件来生成链接，以及在路由视图中使用 `<router-view>` 组件来显示路由对应的组件。

这只是Vue Router的基本用法，还有更多高级用法和功能可以探索。你可以查阅Vue Router的官方文档以获取更详细的信息：https://router.vuejs.org/