文档
进入页面后,组件的内容会通过 http
请求到对应的组件文件,当路由中有较多的页面时,会出现一个问题,那就是一次性将所有的组件都加载了,浪费性能,所以可以通过懒加载的形式来处理。
src/router/routes.ts
,使用 react
的 lazy
进行按需引入:
import {
lazy, LazyExoticComponent } from 'react'
export interface RouteType {
path: string
component: LazyExoticComponent<any>
title?: string
exact?: boolean
}
const routes: RouteType[] = [
{
path: '/',
component: lazy(() => import('@/views/home/HomePage'))
},
{
path: '/demo/index',
component: lazy(() => import('@/