vue3+ts 使用路由

1、下载路由

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: 'index',
     component: () => import("../views/index.vue"),
   },
 ];
 
 const router = createRouter({
   history: createWebHashHistory(),
   routes
 });
 export default router;

3、在main.ts中声明```

import router from './router'

app.use(router)

4、在App.vue中使用router

<template>
  <div>
    <router-view />
  </div>
</template>