vue 3 如何使用vue-router

由于Vue Router 不再是一个类，而是一组函数。现在你不用再写 new Router()，而是要调用 createRouter:

1.在main.ts中初始化vue-router

import {createWebHistory,createRouter} from 'vue-router';

2. 新建history对象

import {createWebHistory,createRouter} from 'vue-router';
const history = createWebHistory();

3. 新建router对象

import {createWebHistory,createRouter} from 'vue-router';
const history = createWebHistory();
const router = createRouter({
	history:history,
    routes:[
    {path:'/' ,component:xxxx},
    ...
    ]
});

4. app.use(router)

import {createWebHistory,createRouter} from 'vue-router';
const history = createWebHistory();
const router = createRouter({
	history:history,
    routes:[
    {path:'/' ,component:xxxx},
    ...
    ]
});
const app =  createApp(App);
app.use(router);
app.mount('app');