ant design pro动态路由

通过官方的umi demo能知道动态添加路由是通过app.js下添加patchRoutes实现的，但是antd v2不仅要实现动态路由还要添加basicLayout布局。查看umi编译源码可以发现是通过dynamic方法实现的，所以参照源码：

动态路由要配合动态菜单，动态添加菜单就不写了，直接改models/menu下的menuData即可，网上都有demo

    /**import \_dvaDynamic from 'dva/dynamic';**/

    path: '/', 

    component: \_\_IS\_BROWSER 

      ? \_dvaDynamic({ 

          component: () => 

            import(/\* webpackChunkName: "layouts\_\_BasicLayout" \*/ '../../layouts/BasicLayout'), 

          LoadingComponent: require('C:/ant-design-pro-v2/src/components/PageLoading/index') 

            .default, 

        }) 

      : require('../../layouts/BasicLayout').default,

我们自己的代码：

/***app.js***/

export function patchRoutes(routes) { 

let routerMap={ 

    Flow:dynamic({ component: () => import('./pages/Editor/GGEditor/Flow' )}) 

} 

routes[1].routes.unshift( 

{ 

  name: 'editor', 

  icon: 'highlight', 

  path: '/editor', 

  routes: [ 

    { 

      authority: [ 'usr'], 

      path: '/editor/flow', 

      name: 'flow', 

      component:routerMap.Flow 

} 

  ], 

}, 

)

实现效果了！如下↓

3084846423-5e048410206a5_articlex.png

router.config配置中没有editor配置哦

932514268-5e04846365a74_articlex.png