From cc7212e191193db2252d720bbcda4143f89f38fd Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Tue, 14 Nov 2017 21:06:04 +0800
Subject: [PATCH] Fix dynamic component remount, #114

---
 src/layouts/BasicLayout.js | 13 +++++++++++--
 src/layouts/UserLayout.js  | 11 ++++++++++-
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/layouts/BasicLayout.js b/src/layouts/BasicLayout.js
index 3ba0ad3c..307a15b6 100644
--- a/src/layouts/BasicLayout.js
+++ b/src/layouts/BasicLayout.js
@@ -203,6 +203,15 @@ class BasicLayout extends React.PureComponent {
     });
     return groupBy(newNotices, 'type');
   }
+  getRouteComponent(item) {
+    if (this.routeComponents[item.path]) {
+      return this.routeComponents[item.path];
+    }
+    const component = item.component(this.props.app);
+    this.routeComponents[item.path] = component;
+    return component;
+  }
+  routeComponents = {};
   handleOpenChange = (openKeys) => {
     const lastOpenKey = openKeys[openKeys.length - 1];
     const isMainMenu = this.menus.some(
@@ -239,7 +248,7 @@ class BasicLayout extends React.PureComponent {
     }
   }
   render() {
-    const { app, currentUser, collapsed, fetchingNotices } = this.props;
+    const { currentUser, collapsed, fetchingNotices } = this.props;
 
     const menu = (
       <Menu className={styles.menu} selectedKeys={[]} onClick={this.onMenuClick}>
@@ -352,7 +361,7 @@ class BasicLayout extends React.PureComponent {
                       exact={item.exact}
                       key={item.path}
                       path={item.path}
-                      component={item.component(app)}
+                      component={this.getRouteComponent(item)}
                     />
                   )
                 )
diff --git a/src/layouts/UserLayout.js b/src/layouts/UserLayout.js
index c6212a56..0eb56005 100644
--- a/src/layouts/UserLayout.js
+++ b/src/layouts/UserLayout.js
@@ -39,6 +39,15 @@ class UserLayout extends React.PureComponent {
     });
     return title;
   }
+  getRouteComponent(item) {
+    if (this.routeComponents[item.path]) {
+      return this.routeComponents[item.path];
+    }
+    const component = item.component(this.props.app);
+    this.routeComponents[item.path] = component;
+    return component;
+  }
+  routeComponents = {};
   render() {
     return (
       <DocumentTitle title={this.getPageTitle()}>
@@ -59,7 +68,7 @@ class UserLayout extends React.PureComponent {
                   exact={item.exact}
                   key={item.path}
                   path={item.path}
-                  component={item.component(this.props.app)}
+                  component={this.getRouteComponent()}
                 />
               )
             )
-- 
GitLab