bug fix#862 determine if the target is instantiated

src/components/Authorized/Authorized.js

@@ -5,11 +5,7 @@ class Authorized extends React.Component {
   render() {
     const { children, authority, noMatch = null } = this.props;
     const childrenRender = typeof children === 'undefined' ? null : children;
-    return CheckPermissions(
-      authority,
-      childrenRender,
-      noMatch
-    );
+    return CheckPermissions(authority, childrenRender, noMatch);
   }
 }
 

src/components/Authorized/AuthorizedRoute.js

@@ -4,16 +4,28 @@ import Authorized from './Authorized';
 
 class AuthorizedRoute extends React.Component {
   render() {
-    const { component: Component, render, authority,
-      redirectPath, ...rest } = this.props;
+    const {
+      component: Component,
+      render,
+      authority,
+      redirectPath,
+      ...rest
+    } = this.props;
     return (
       <Authorized
         authority={authority}
-        noMatch={<Route {...rest} render={() => <Redirect to={{ pathname: redirectPath }} />} />}
+        noMatch={
+          <Route
+            {...rest}
+            render={() => <Redirect to={{ pathname: redirectPath }} />}
+          />
+        }
       >
         <Route
           {...rest}
-          render={props => (Component ? <Component {...props} /> : render(props))}
+          render={props =>
+            (Component ? <Component {...props} /> : render(props))
+          }
         />
       </Authorized>
     );

src/components/Authorized/CheckPermissions.js

@@ -3,7 +3,11 @@ import PromiseRender from './PromiseRender';
 import { CURRENT } from './index';
 
 function isPromise(obj) {
-  return !!obj && (typeof obj === 'object' || typeof obj === 'function') && typeof obj.then === 'function';
+  return (
+    !!obj &&
+    (typeof obj === 'object' || typeof obj === 'function') &&
+    typeof obj.then === 'function'
+  );
 }
 
 /**

src/components/Authorized/PromiseRender.js

@@ -6,22 +6,34 @@ export default class PromiseRender extends React.PureComponent {
     component: null,
   };
   componentDidMount() {
+    const ok = this.checkIsInstantiation(this.props.ok);
+    const error = this.checkIsInstantiation(this.props.error);
     this.props.promise
       .then(() => {
         this.setState({
-          component: this.props.ok,
+          component: ok,
         });
       })
       .catch(() => {
         this.setState({
-          component: () => this.props.error,
+          component: error,
         });
       });
   }
+  // Determine whether the incoming component has been instantiated
+  // AuthorizedRoute is already instantiated
+  // Authorized  render is already instantiated, children is no instantiated
+  // Secured is not instantiated
+  checkIsInstantiation = (target) => {
+    if (!React.isValidElement(target)) {
+      return target;
+    }
+    return () => target;
+  };
   render() {
-    const C = this.state.component;
-    return C ? (
-      <C {...this.props} />
+    const Component = this.state.component;
+    return Component ? (
+      <Component {...this.props} />
     ) : (
       <div
         style={{

src/components/Authorized/Secured.js

@@ -38,11 +38,7 @@ const authorize = (authority, error) => {
     throw new Error('authority is required');
   }
   return function decideAuthority(targer) {
-    return () => CheckPermissions(
-      authority,
-      targer,
-      classError || Exception403
-    );
+    return () => CheckPermissions(authority, targer, classError || Exception403);
   };
 };