react-umi-4.纯前端架构总结篇

我们全部基于umi框架实现了

1. Layou快速布局
2. ProComponents组件介绍以及使用
3. 登录模块
4. 首页模块
5. 菜单模块
6. 管理员模块
7. 角色模块
8. 动态路由

Layout快速布局

.umirc.ts

 layout: {
    name: 'An中台系统',
    theme: 'pro',
    locale: true,
 }, 
 routes: [
    { path: '/login', layout: false, component: '@/pages/login' },
    { path: '/', menu: {name: '首页', icon: 'home'},  component: '@/pages/index' },
    {
      path: '/menu',
      menu: {
        name: "菜单管理",
        icon: 'home',
      },
      routes: [
        { path: '/menu/list',
          menu: {
            name: "菜单列表",
            icon: 'home',
          },
          component: '@/pages/index'
        },
      ]
    },
    {
      path: '/auth',
      menu: {
        name: "权限管理",
        icon: &