umi max配置动态路由流程及遇到的坑

设置动态路由

1.routes.js设置不需要动态显示的路由

2.app.tsx中patchClientRoutes动态修改路由信息

注意：此时除了修改routes字段还需要同时修改children，否则不生效

export function patchClientRoutes({
    
     routes }:any) {
    
    
  console.log('patchClientRoutes')
  try {
    
    
    let initialState:any = JSON.parse(localStorage.getItem('userData')||'');
    let menu = initialState.menuList || [];
    const last = routes.length - 1;
    routes[last].routes = routes[last].routes.concat(menu)
    routes[last].children = routes[last].routes
  } catch (error) {
    
    }
}

3.routes配置的坑

一、开发不受layout影响的页面时需要设置layout：false,与此同时会将此路由单独牵引出来，因此动态修改路由的时候要注意修改的项。

二、设置layout:false之后access也会失效，因为access是与layout相关的设置，此时应该用wrappers设置能否进入。