Merge pull request #2 from nabepon/on_async_loader

feat: add option to detect if route was changed

Author: koichik

README.md

@@ -124,13 +124,13 @@ explicitly if you want to use store's state.
 If you want to invoke `asyncLoader()` when just querystring (not path) is changed, you must specify key names of querystring to router.
 
 ```
-<Route path="items" component=ItemList queryKeys="q, page" ... />
+<Route path="items" component=ItemList asyncLoaderProps={{queryKeys: "q, page"}} ... />
 ```
 
 Or, you can use the wildcard for any keys of querystring:
 
 ```
-<Route path="items" component=ItemList queryKeys="*" ... />
+<Route path="items" component=ItemList asyncLoaderProps={{queryKeys: "*"}} ... />
 ```
 
 ### 5. Async data loading by mounting/updating (client-side rendering only)

src/computeChangedRoutes.js

@@ -19,7 +19,8 @@ export default function computeChangedRoutes(prevState, nextState) {
   const leaveIndex = prevRoutes.findIndex((route) => (
     nextRoutes.indexOf(route) === -1 ||
     routeParamsChanged(route, prevState, nextState) ||
-    queryParamsChanged(route, prevState, nextState)
+    queryParamsChanged(route, prevState, nextState) ||
+    routeChanged(route, prevState, nextState)
   ));
   const leaveRoutes = leaveIndex === -1 ? [] : prevRoutes.slice(leaveIndex);
 
@@ -44,7 +45,7 @@ function routeParamsChanged(route, prevState, nextState) {
 }
 
 function queryParamsChanged(route, prevState, nextState) {
-  const queryKeys = route.queryKeys;
+  const queryKeys = route.asyncLoaderProps && route.asyncLoaderProps.queryKeys || route.queryKeys;
   if (!queryKeys) {
     return false;
   }
@@ -63,3 +64,8 @@ function queryParamsChanged(route, prevState, nextState) {
   const keys = queryKeys.split(/[, ]+/);
   return keys.some((key) => prevQuery[key] !== nextQuery[key]);
 }
+
+function routeChanged(route, prevState, nextState) {
+  const routeChanged = route.asyncLoaderProps && route.asyncLoaderProps.routeChanged;
+  return routeChanged && routeChanged(route, prevState, nextState);
+}