refactor inhuman code of nav.js

src/common/nav.js

 import dynamic from 'dva/dynamic';
 
-export const getNavData = app => [{
-  component: dynamic({
+// models
+import UserModel from '../models/user';
+import ChartModel from '../models/chart';
+import MonitorModel from '../models/monitor';
+import ProjectModel from '../models/project';
+import ActivitiesModel from '../models/activities';
+import FormModel from '../models/form';
+import RuleModel from '../models/rule';
+import ListModel from '../models/list';
+import ProfileModel from '../models/profile';
+import LoginModel from '../models/login';
+import RegisterModel from '../models/register';
+
+// components
+import BasicLayout from '../layouts/BasicLayout';
+import UserLayout from '../layouts/UserLayout';
+import BlankLayout from '../layouts/BlankLayout';
+
+import Analysis from '../routes/Dashboard/Analysis';
+import Monitor from '../routes/Dashboard/Monitor';
+import Workplace from '../routes/Dashboard/Workplace';
+
+import BasicForm from '../routes/Forms/BasicForm';
+import AdvancedForm from '../routes/Forms/AdvancedForm';
+import StepForm from '../routes/Forms/StepForm';
+import Step2 from '../routes/Forms/StepForm/Step2';
+import Step3 from '../routes/Forms/StepForm/Step3';
+
+import TableList from '../routes/List/TableList';
+import BasicList from '../routes/List/BasicList';
+import CardList from '../routes/List/CardList';
+import CoverCardList from '../routes/List/CoverCardList';
+import FilterCardList from '../routes/List/FilterCardList';
+import SearchList from '../routes/List/SearchList';
+
+import BasicProfile from '../routes/Profile/BasicProfile';
+import AdvancedProfile from '../routes/Profile/AdvancedProfile';
+
+import Success from '../routes/Result/Success';
+import Error from '../routes/Result/Error';
+import Exception403 from '../routes/Exception/403';
+import Exception404 from '../routes/Exception/404';
+import Exception500 from '../routes/Exception/500';
+
+import Login from '../routes/User/Login';
+import Register from '../routes/User/Register';
+import RegisterResult from '../routes/User/RegisterResult';
+
+// wrapper of dynamic
+const dy = (app, models, component) => dynamic({
   app,
-    models: () => [
-      import('../models/user'),
-    ],
-    component: () => import('../layouts/BasicLayout'),
-  }),
+  models: () => models,
+  component: () => component,
+});
+
+// nav data
+export const getNavData = app => [
+  {
+    component: dy(app, [UserModel], BasicLayout),
     layout: 'BasicLayout',
     name: '首页', // for breadcrumb
     path: '/',
-  children: [{
+    children: [
+      {
         name: 'Dashboard',
         icon: 'dashboard',
         path: 'dashboard',
-    children: [{
+        children: [
+          {
             name: '分析页',
             path: 'analysis',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/chart'),
-        ],
-        component: () => import('../routes/Dashboard/Analysis'),
-      }),
-    }, {
+            component: dy(app, [ChartModel], Analysis),
+          },
+          {
             name: '监控页',
             path: 'monitor',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/monitor'),
-        ],
-        component: () => import('../routes/Dashboard/Monitor'),
-      }),
-    }, {
+            component: dy(app, [MonitorModel], Monitor),
+          },
+          {
             name: '工作台',
             path: 'workplace',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/project'),
-          import('../models/activities'),
-          import('../models/chart'),
+            component: dy(app, [ProjectModel, ActivitiesModel, ChartModel], Workplace),
+          },
         ],
-        component: () => import('../routes/Dashboard/Workplace'),
-      }),
-    }],
-  }, {
+      },
+      {
         name: '表单页',
         path: 'form',
         icon: 'form',
-    children: [{
+        children: [
+          {
             name: '基础表单',
             path: 'basic-form',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/form'),
-        ],
-        component: () => import('../routes/Forms/BasicForm'),
-      }),
-    }, {
+            component: dy(app, [FormModel], BasicForm),
+          },
+          {
             name: '分步表单',
             path: 'step-form',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/form'),
-        ],
-        component: () => import('../routes/Forms/StepForm'),
-      }),
-      children: [{
+            component: dy(app, [FormModel], StepForm),
+            children: [
+              {
                 path: 'confirm',
-        component: dynamic({
-          app,
-          models: () => [
-            import('../models/form'),
-          ],
-          component: () => import('../routes/Forms/StepForm/Step2'),
-        }),
-      }, {
+                component: dy(app, [FormModel], Step2),
+              },
+              {
                 path: 'result',
-        component: dynamic({
-          app,
-          models: () => [
-            import('../models/form'),
+                component: dy(app, [FormModel], Step3),
+              },
             ],
-          component: () => import('../routes/Forms/StepForm/Step3'),
-        }),
-      }],
-    }, {
+          },
+          {
             name: '高级表单',
             path: 'advanced-form',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/form'),
+            component: dy(app, [FormModel], AdvancedForm),
+          },
         ],
-        component: () => import('../routes/Forms/AdvancedForm'),
-      }),
-    }],
       }, {
         name: '列表页',
         path: 'list',
         icon: 'table',
-    children: [{
+        children: [
+          {
             name: '查询表格',
             path: 'table-list',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/rule'),
-        ],
-        component: () => import('../routes/List/TableList'),
-      }),
-    }, {
+            component: dy(app, [RuleModel], TableList),
+          },
+          {
             name: '标准列表',
             path: 'basic-list',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/list'),
-        ],
-        component: () => import('../routes/List/BasicList'),
-      }),
-    }, {
+            component: dy(app, [ListModel], BasicList),
+          },
+          {
             name: '卡片列表',
             path: 'card-list',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/list'),
-        ],
-        component: () => import('../routes/List/CardList'),
-      }),
-    }, {
+            component: dy(app, [ListModel], CardList),
+          },
+          {
             name: '搜索列表（项目）',
             path: 'cover-card-list',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/list'),
-        ],
-        component: () => import('../routes/List/CoverCardList'),
-      }),
-    }, {
+            component: dy(app, [ListModel], CoverCardList),
+          },
+          {
             name: '搜索列表（应用）',
             path: 'filter-card-list',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/list'),
-        ],
-        component: () => import('../routes/List/FilterCardList'),
-      }),
-    }, {
+            component: dy(app, [ListModel], FilterCardList),
+          },
+          {
             name: '搜索列表（文章）',
             path: 'search',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/list'),
+            component: dy(app, [ListModel], SearchList),
+          },
         ],
-        component: () => import('../routes/List/SearchList'),
-      }),
-    }],
-  }, {
+      },
+      {
         name: '详情页',
         path: 'profile',
         icon: 'profile',
-    children: [{
+        children: [
+          {
             name: '基础详情页',
             path: 'basic',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/profile'),
-        ],
-        component: () => import('../routes/Profile/BasicProfile'),
-      }),
-    }, {
+            component: dy(app, [ProfileModel], BasicProfile),
+          },
+          {
             name: '高级详情页',
             path: 'advanced',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/profile'),
+            component: dy(app, [ProfileModel], AdvancedProfile),
+          },
         ],
-        component: () => import('../routes/Profile/AdvancedProfile'),
-      }),
-    }],
-  }, {
+      },
+      {
         name: '结果',
         path: 'result',
         icon: 'check-circle-o',
-    children: [{
+        children: [
+          {
             name: '成功',
             path: 'success',
-      component: dynamic({
-        app,
-        component: () => import('../routes/Result/Success'),
-      }),
-    }, {
+            component: dy(app, [], Success),
+          },
+          {
             name: '失败',
             path: 'fail',
-      component: dynamic({
-        app,
-        component: () => import('../routes/Result/Error'),
-      }),
-    }],
-  }, {
+            component: dy(app, [], Error),
+          },
+        ],
+      },
+      {
         name: '异常',
         path: 'exception',
         icon: 'warning',
-    children: [{
+        children: [
+          {
             name: '403',
             path: '403',
-      component: dynamic({
-        app,
-        component: () => import('../routes/Exception/403'),
-      }),
-    }, {
+            component: dy(app, [], Exception403),
+          },
+          {
             name: '404',
             path: '404',
-      component: dynamic({
-        app,
-        component: () => import('../routes/Exception/404'),
-      }),
-    }, {
+            component: dy(app, [], Exception404),
+          },
+          {
             name: '500',
             path: '500',
-      component: dynamic({
-        app,
-        component: () => import('../routes/Exception/500'),
-      }),
-    }],
-  }],
-}, {
-  component: dynamic({
-    app,
-    component: () => import('../layouts/UserLayout'),
-  }),
+            component: dy(app, [], Exception500),
+          },
+        ],
+      },
+    ],
+  },
+  {
+    component: dy(app, [], UserLayout),
     path: '/user',
     layout: 'UserLayout',
-  children: [{
+    children: [
+      {
         name: '帐户',
         icon: 'user',
         path: 'user',
-    children: [{
+        children: [
+          {
             name: '登录',
             path: 'login',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/login'),
-        ],
-        component: () => import('../routes/User/Login'),
-      }),
-    }, {
+            component: dy(app, [LoginModel], Login),
+          },
+          {
             name: '注册',
             path: 'register',
-      component: dynamic({
-        app,
-        models: () => [
-          import('../models/register'),
-        ],
-        component: () => import('../routes/User/Register'),
-      }),
-    }, {
+            component: dy(app, [RegisterModel], Register),
+          },
+          {
             name: '注册结果',
             path: 'register-result',
-      component: dynamic({
-        app,
-        component: () => import('../routes/User/RegisterResult'),
-      }),
-    }],
-  }],
-}, {
-  component: dynamic({
-    app,
-    component: () => import('../layouts/BlankLayout'),
-  }),
+            component: dy(app, [], RegisterResult),
+          },
+        ],
+      },
+    ],
+  },
+  {
+    component: dy(app, [], BlankLayout),
     layout: 'BlankLayout',
     children: {
       name: '使用文档',
@@ -290,4 +249,5 @@ export const getNavData = app => [{
       target: '_blank',
       icon: 'book',
     },
-}];
+  },
+];