Vue3 实现路由跳转

要实现路由跳转,可以使用Vue Router。下面是一个简单的示例:

1. 首先,通过命令行安装Vue Router插件:

“`bash

npm install vue-router@next

“`

2. 在Vue项目的入口文件(通常是main.js)中,引入Vue Router并配置路由:

“`javascript

import { createApp } from ‘vue’;

import { createRouter, createWebHistory } from ‘vue-router’;

import Home from ‘./components/Home.vue’;

import About from ‘./components/About.vue’;

const router = createRouter({

history: createWebHistory(),

routes: [

{ path: ‘/’, component: Home },

{ path: ‘/about’, component: About }

]

});

const app = createApp(App);

app.use(router);

app.mount(‘#app’);

“`

3. 在Vue组件中使用“来实现路由跳转:

“`vue

Home

About

“`

4. 在Vue组件中使用“来渲染对应的组件:

“`vue

My App

“`

这样就可以实现基本的路由跳转了。当用户点击“时,Vue Router会自动更新URL,并渲染对应的组件到“中。

更详细的用法和配置可以参考Vue Router的官方文档:https://next.router.vuejs.org/

# 回答此问题

后才能回答