fix name router componet this match issus

README.md

@@ -3,7 +3,7 @@
 [![NPM version](https://img.shields.io/npm/v/react-view-router.svg?style=flat)](https://npmjs.com/package/react-view-router)
 [![NPM downloads](https://img.shields.io/npm/dm/react-view-router.svg?style=flat)](https://npmjs.com/package/react-view-router)
 
-> Route configuration component for `react-router-dom`. `react-view-router` is just `react-router-dom@5` wrapper that can write routing configuration like [vue-router](https://router.vuejs.org/guide/#javascript) in react. see: [Nested Routes](https://router.vuejs.org/guide/essentials/nested-routes.html)
+> Route configuration component for `react-router-dom`. `react-view-router` is just a `react-router-dom@5` wrapper that can write routing configuration like [vue-router](https://router.vuejs.org/guide/#javascript) in react. see: [Nested Routes](https://router.vuejs.org/guide/essentials/nested-routes.html)
 
 ## Installation
 
@@ -298,7 +298,10 @@ Includes all props from `react-router-dom` and the following props.
       // the original route config
       config,
       // the component instance that matched this route config if found.
-      componentInstance: React.Component,
+      componentInstances: {
+        default: React.Component,
+        /* others: React.Component */
+      }
       // the RouterView instance that matched this route config if found.
       viewInstance: RouterView
     }
@@ -398,7 +401,7 @@ function isLocation(v) {}
 ``` 
 otherwise, webpack will package both `history` and `history-fix` into the target js file.
 
-2. if route component is `Class Component` (not `Function Component`), then `this` variable in `afterRouteEnter`, `beforeRouteUpdate`,`beforeRouteLeave`,`afterRouteLeave` Component Guards and `afterEnter`,`beforeUpdate`,`beforeLeave`,`afterLeave` in Route Guards will be that component instance;
+2. if route component is `Class Component` (not `Function Component`), then `this` variable in `afterRouteEnter`, `beforeRouteUpdate`,`beforeRouteLeave`,`afterRouteLeave` Component Guards will be that component instance;
 
 ## License
 

demo/build/webpack-base.config.js

@@ -39,8 +39,8 @@ module.exports = function (options) {
   const assetsDir = path.resolve(porjectDir, project.assets.dir);
   // let srcLibDir = path.resolve(srcDir, project.src.libs);
   const distDir = path.resolve(porjectDir, project.dist.dir);
-  const distLibsDir = path.resolve(distDir, project.dist.libs);
-  const distAssetsDir = path.resolve(distDir, project.dist.assets);
+  // const distLibsDir = path.resolve(distDir, project.dist.libs);
+  // const distAssetsDir = path.resolve(distDir, project.dist.assets);
 
   const rootDir = options.root || process.cwd();
   const nodeModPath = path.resolve(rootDir, './node_modules');

demo/src/views/component/home/main/some/footer.js

@@ -1,9 +1,34 @@
 import React from 'react';
+import { useRouteGuards } from 'react-view-router';
 
-export default function HomeMainSomeFooter() {
-  return (
-    <div>
-      <h1>HomeMainSomeFooter</h1>
-    </div>
-  );
+class HomeMainSomeFooter extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { text: 'text1' };
+    console.log('HomeMainSomeFooter constructor');
+  }
+
+  render() {
+    const { text } = this.state;
+    return (
+      <div>
+        <h1>HomeMainSomeFooter</h1>
+        { text }
+      </div>
+    );
+  }
 }
+
+export default useRouteGuards(
+  // component
+  HomeMainSomeFooter,
+  // route guards
+  {
+    beforeRouteEnter(to, from, next) {
+      console.log('HomeMainSomeFooter beforeRouteEnter', to, from);
+      next(vm => {
+        console.log('HomeMainSomeFooter beforeRouteEnter next', vm, to, from);
+      });
+    },
+  }
+);

demo/src/views/component/home/main/some/index.js

@@ -36,6 +36,7 @@ export default useRouteGuards(
   // route guards
   {
     beforeRouteEnter(to, from, next) {
+      console.log('HomeMainSomeIndex beforeRouteEnter', to, from);
       if (!store.logined) next('/login');
       else next(vm => {
         console.log('HomeMainSomeIndex beforeRouteEnter next', vm, to, from);