1、下载router
npm install vue-router@4
2、在router/index.ts定义router
/**
* createRouter 这个为创建路由的方法
* createWebHashHistory 这个就是vue2中路由的模式,
* 这里的是hash模式,这个还可以是createWebHistory等
* RouteRecordRaw 这个为要添加的路由记录,也可以说是routes的ts类型
*/
import {createRouter, createWebHashHistory, RouteRecordRaw} from 'vue-router';
// 路由记录,这个跟vue2中用法一致,就不做过多解释了
const routes:Array<RouteRecordRaw> = [
{
path: '/',
name: 'home',
component: () => import("@/view/page/home.vue"),
},
];
const router = createRouter({
history: createWebHashHistory(),
routes
});
export default router;
3、mian.ts中声明router
import router from './router'
app.use(router);
4、在app.vue中使用router
<router-view >
</router-view>