框架的權限控制（在config.ts中配置）

export default {access: {},
};

權限配置文件（access.ts）

新建?src/access.ts?，在該文件中?export default?一個函數，定義用戶擁有的權限

該文件需要返回一個 function，返回的 function 會在應用初始化階段被執行，執行后返回的對象將會被作為用戶所有權限的定義。對象的每個 key 對應一個 boolean 值，只有 true 和 false，代表用戶是否有該權限

1.定義normalroutes數組，包含普通用戶默認訪問的頁面

 const normalRoutes = ['dashboard', 'user']; // 普通用戶默認權限

2.定義adminroutes數組，包含管理員默認訪問的頁面

const adminRoutes = ['admin', 'settings', 'card', 'list.table-list', 'class', 'study', 'goods', '商品管理', '訂單管理', '輪播管理'];

3.定義adminroutes數組，包含所有用戶默認訪問的頁面

const allUserRoutes = ['welcome'];

4.根據用戶是否是管理員，合并normalroutes得到hasRoutes數組

const hasRoutes = isAdmin ? [...normalRoutes, ...adminRoutes] : normalRoutes;

  return {adminRouteFilter: () => isAdmin,normalRouteFilter: (route) => hasRoutes.includes(route.name),allUserRouteFilter: (route) => allUserRoutes.includes(route.name),};
}  

路由配置文件
?

在每個路由中使用相應的權限過濾規則，需要按以下方式在常規路由配置中加上?access?這一項

/*** @name umi 的路由配置* @description 只支持 path,component,routes,redirect,wrappers,name,icon 的配置* @param path  path 只支持兩種占位符配置，第一種是動態參數 :id 的形式，第二種是 * 通配符，通配符只能出現路由字符串的最后。* @param component 配置 location 和 path 匹配后用于渲染的 React 組件路徑。可以是絕對路徑，也可以是相對路徑，如果是相對路徑，會從 src/pages 開始找起。* @param routes 配置子路由，通常在需要為多個路徑增加 layout 組件時使用。* @param redirect 配置路由跳轉* @param wrappers 配置路由組件的包裝組件，通過包裝組件可以為當前的路由組件組合進更多的功能。 比如，可以用于路由級別的權限校驗* @param name 配置路由的標題，默認讀取國際化文件 menu.ts 中 menu.xxxx 的值，如配置 name 為 login，則讀取 menu.ts 中 menu.login 的取值作為標題* @param icon 配置路由的圖標，取值參考 https://ant.design/components/icon-cn， 注意去除風格后綴和大小寫，如想要配置圖標為 <StepBackwardOutlined /> 則取值應為 stepBackward 或 StepBackward，如想要配置圖標為 <UserOutlined /> 則取值應為 user 或者 User* @doc https://umijs.org/docs/guides/routes*/
// 引入常量
import { ADMIN_PAGE, SETTINGS_PAGE, CARD_PAGE, LIST_TABLE_LIST_PAGE, CLASS_PAGE, STUDY_PAGE, GOODS_PAGE, GOODS_MANAGEMENT_PAGE, ORDER_MANAGEMENT_PAGE, BANNER_MANAGEMENT_PAGE } from './access';export default [{path: '/user',layout: false,routes: [{name: 'login',path: '/user/login',component: './User/Login',access: 'adminRouteFilter',},],},{path: '/welcome',name: 'welcome',icon: 'crown',component: './Welcome',access: 'allUserRouteFilter',},{path: '/card',name: CARD_PAGE,icon: 'smile',component: './Card',access: 'adminRouteFilter',},{path: '/admin',name: ADMIN_PAGE,icon: 'crown',access: 'adminRouteFilter',routes: [{path: '/admin',redirect: '/admin/sub-page',access: 'normalRouteFilter',},{path: '/admin/sub-page',name: 'sub-page',component: './Admin',access: 'normalRouteFilter',},],},{name: LIST_TABLE_LIST_PAGE,icon: 'table',path: '/list',component: './TableList',access: 'adminRouteFilter',},{name: CLASS_PAGE,icon: 'crown',path: '/class',component: './Class',access: 'adminRouteFilter',},{path: '/study',name: STUDY_PAGE,icon: 'table',component: './Study',access: 'adminRouteFilter',},{path: '/goods',name: GOODS_PAGE,icon: 'smile',component: './Goods',access: 'adminRouteFilter',},{path: '/Controls',name: GOODS_MANAGEMENT_PAGE,icon: 'table',access: 'adminRouteFilter',routes: [{path: '/Controls/list',name: '商品列表',component: './Controls/list',access: 'adminRouteFilter',},{path: '/Controls/rubbish',name: '商品回收站',component: './Controls/rubbish',access: 'adminRouteFilter',},],},{path: '/order',name: ORDER_MANAGEMENT_PAGE,icon: 'smile',component: './order',access: 'adminRouteFilter',},{path: '/banner',name: BANNER_MANAGEMENT_PAGE,icon: 'crown',component: './banner',access: 'adminRouteFilter',},{path: '/',redirect: '/welcome',},{path: '*',layout: false,component: './404',},
];