集成

第1步:package.json引入库

{
  "@extscreen/es3-router": "^1.1.0"
}

第2步:创建RouteMap

创建routes.ts加入页面路由配置。

下面以index.vue页面为例:

import index from "./views/index.vue";

const routes = [
  {
    path: '/index',
    name: 'index',
    component: index,
  },
  {
    path: '/error',
    name: 'error',
    component: error,
  },
]

第3步:main.ts中初始化


import { createESRouter } from '@extscreen/es3-router'
import routes from "./routes.ts";
import type { Router } from '@extscreen/es3-router';

const routerOptions = {
  main: 'index',
  error: 'error',
  limit: 10,
  routes,
}
const router: Router = createESRouter(routerOptions)
const app: ESApp = createESApp(application, router);
app.use(install);

第4步:App.vue中初始化


<template>
  <div id="root">
    <es-router-view />
  </div>
</template>

配置完成,并且初始化成功后就可以进行页面的跳转了。