fix: merge initial params on push

2026-05-14 15:52:37 +08:00 · 2019-11-16 20:01:58 +01:00
parent c17ad18b20
commit 11efb06642
13 changed files with 292 additions and 107 deletions
--- a/packages/core/src/tests/NavigationContainer.test.tsx
+++ b/packages/core/src/tests/NavigationContainer.test.tsx
@@ -163,14 +163,14 @@ it('handle dispatching with ref', () => {
        return true;
      },

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'REVERSE') {
          return {
            ...state,
            routes: state.routes.slice().reverse(),
          };
        }
-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
--- a/packages/core/src/tests/useDescriptors.test.tsx
+++ b/packages/core/src/tests/useDescriptors.test.tsx
@@ -419,12 +419,12 @@ it(`returns false for canGoBack when current router doesn't handle GO_BACK`, ()
    const ChildRouter: Router<NavigationState, MockActions> = {
      ...CurrentMockRouter,

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'GO_BACK') {
          return null;
        }

-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
@@ -470,12 +470,12 @@ it('returns true for canGoBack when current router handles GO_BACK', () => {
    const ChildRouter: Router<NavigationState, MockActions> = {
      ...CurrentMockRouter,

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'GO_BACK') {
          return state;
        }

-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
@@ -537,12 +537,12 @@ it('returns true for canGoBack when parent router handles GO_BACK', () => {
    const ChildRouter: Router<NavigationState, MockActions> = {
      ...CurrentMockRouter,

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'GO_BACK') {
          return state;
        }

-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
--- a/packages/core/src/tests/useEventEmitter.test.tsx
+++ b/packages/core/src/tests/useEventEmitter.test.tsx
@@ -230,7 +230,7 @@ it('fires blur event when a route is removed with a delay', async () => {
        };
      },

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        switch (action.type) {
          case 'PUSH':
            return {
@@ -248,7 +248,7 @@ it('fires blur event when a route is removed with a delay', async () => {
            };
          }
          default:
-            return router.getStateForAction(state, action);
+            return router.getStateForAction(state, action, options);
        }
      },

--- a/packages/core/src/tests/useOnAction.test.tsx
+++ b/packages/core/src/tests/useOnAction.test.tsx
@@ -20,7 +20,7 @@ it("lets parent handle the action if child didn't", () => {
    > = {
      ...CurrentMockRouter,

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'REVERSE') {
          return {
            ...state,
@@ -28,7 +28,7 @@ it("lets parent handle the action if child didn't", () => {
          };
        }

-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ParentRouter;
@@ -103,14 +103,14 @@ it("lets children handle the action if parent didn't", () => {
        return true;
      },

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'REVERSE') {
          return {
            ...state,
            routes: state.routes.slice().reverse(),
          };
        }
-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
@@ -229,7 +229,7 @@ it("action doesn't bubble if target is specified", () => {
        return true;
      },

-      getStateForAction(state, action) {
+      getStateForAction(state, action, options) {
        if (action.type === 'REVERSE') {
          return {
            ...state,
@@ -237,7 +237,7 @@ it("action doesn't bubble if target is specified", () => {
          };
        }

-        return CurrentMockRouter.getStateForAction(state, action);
+        return CurrentMockRouter.getStateForAction(state, action, options);
      },
    };
    return ChildRouter;
--- a/packages/core/src/types.tsx
+++ b/packages/core/src/types.tsx
@@ -118,6 +118,11 @@ export type RouterFactory<
  RouterOptions extends DefaultRouterOptions
 > = (options: RouterOptions) => Router<State, Action>;

+export type RouterConfigOptions = {
+  routeNames: string[];
+  routeParamList: ParamListBase;
+};
+
 export type Router<
  State extends NavigationState,
  Action extends NavigationAction
@@ -134,10 +139,7 @@ export type Router<
   * @param options.routeNames List of valid route names as defined in the screen components.
   * @param options.routeParamsList Object containing params for each route.
   */
-  getInitialState(options: {
-    routeNames: string[];
-    routeParamList: ParamListBase;
-  }): State;
+  getInitialState(options: RouterConfigOptions): State;

  /**
   * Rehydrate the full navigation state from a given partial state.
@@ -148,10 +150,7 @@ export type Router<
   */
  getRehydratedState(
    partialState: PartialState<State> | State,
-    options: {
-      routeNames: string[];
-      routeParamList: ParamListBase;
-    }
+    options: RouterConfigOptions
  ): State;

  /**
@@ -163,10 +162,7 @@ export type Router<
   */
  getStateForRouteNamesChange(
    state: State,
-    options: {
-      routeNames: string[];
-      routeParamList: ParamListBase;
-    }
+    options: RouterConfigOptions
  ): State;

  /**
@@ -183,10 +179,13 @@ export type Router<
   *
   * @param state State object to apply the action on.
   * @param action Action object to apply.
+   * @param options.routeNames List of valid route names as defined in the screen components.
+   * @param options.routeParamsList Object containing params for each route.
   */
  getStateForAction(
    state: State,
-    action: Action
+    action: Action,
+    options: RouterConfigOptions
  ): State | PartialState<State> | null;

  /**
--- a/packages/core/src/useNavigationBuilder.tsx
+++ b/packages/core/src/useNavigationBuilder.tsx
@@ -243,7 +243,11 @@ export default function useNavigationBuilder<
    // The update should be limited to current navigator only, so we call the router manually
    const updatedState = router.getStateForAction(
      state,
-      navigate(route.params.screen, route.params.params)
+      navigate(route.params.screen, route.params.params),
+      {
+        routeNames,
+        routeParamList,
+      }
    );

    nextState =
@@ -309,6 +313,10 @@ export default function useNavigationBuilder<
    setState,
    key,
    listeners: actionListeners,
+    routerConfigOptions: {
+      routeNames,
+      routeParamList,
+    },
  });

  const onRouteFocus = useOnRouteFocus({
--- a/packages/core/src/useNavigationHelpers.tsx
+++ b/packages/core/src/useNavigationHelpers.tsx
@@ -73,13 +73,18 @@ export default function useNavigationHelpers<
      isFocused: parentNavigationHelpers
        ? parentNavigationHelpers.isFocused
        : () => true,
-      canGoBack: () =>
-        router.getStateForAction(
-          getState(),
-          CommonActions.goBack() as Action
-        ) !== null ||
-        (parentNavigationHelpers && parentNavigationHelpers.canGoBack()) ||
-        false,
+      canGoBack: () => {
+        const state = getState();
+
+        return (
+          router.getStateForAction(state, CommonActions.goBack() as Action, {
+            routeNames: state.routeNames,
+            routeParamList: {},
+          }) !== null ||
+          (parentNavigationHelpers && parentNavigationHelpers.canGoBack()) ||
+          false
+        );
+      },
    } as NavigationHelpers<ParamListBase, EventMap> &
      (NavigationProp<ParamListBase, string, any, any, any> | undefined);
  }, [
--- a/packages/core/src/useOnAction.tsx
+++ b/packages/core/src/useOnAction.tsx
@@ -7,6 +7,7 @@ import {
  NavigationState,
  PartialState,
  Router,
+  RouterConfigOptions,
 } from './types';

 type Options = {
@@ -15,6 +16,7 @@ type Options = {
  getState: () => NavigationState;
  setState: (state: NavigationState | PartialState<NavigationState>) => void;
  listeners: ChildActionListener[];
+  routerConfigOptions: RouterConfigOptions;
 };

 /**
@@ -32,6 +34,7 @@ export default function useOnAction({
  setState,
  key,
  listeners,
+  routerConfigOptions,
 }: Options) {
  const {
    onAction: onActionParent,
@@ -40,6 +43,14 @@ export default function useOnAction({
    trackAction,
  } = React.useContext(NavigationBuilderContext);

+  const routerConfigOptionsRef = React.useRef<RouterConfigOptions>(
+    routerConfigOptions
+  );
+
+  React.useEffect(() => {
+    routerConfigOptionsRef.current = routerConfigOptions;
+  });
+
  const onAction = React.useCallback(
    (
      action: NavigationAction,
@@ -59,7 +70,11 @@ export default function useOnAction({
        return false;
      }

-      let result = router.getStateForAction(state, action);
+      let result = router.getStateForAction(
+        state,
+        action,
+        routerConfigOptionsRef.current
+      );

      // If a target is specified and set to current navigator, the action shouldn't bubble
      // So instead of `null`, we use the state object for such cases to signal that action was handled
--- a/packages/routers/tests/DrawerRouter.test.tsx
+++ b/packages/routers/tests/DrawerRouter.test.tsx
@@ -216,6 +216,10 @@ it("doesn't rehydrate state if it's not stale", () => {

 it('handles navigate action', () => {
  const router = DrawerRouter({});
+  const options = {
+    routeNames: ['baz', 'bar'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -229,7 +233,8 @@ it('handles navigate action', () => {
        isDrawerOpen: false,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('baz', { answer: 42 })
+      CommonActions.navigate('baz', { answer: 42 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -248,6 +253,10 @@ it('handles navigate action', () => {

 it('handles navigate action with open drawer', () => {
  const router = DrawerRouter({});
+  const options = {
+    routeNames: ['baz', 'bar'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -261,7 +270,8 @@ it('handles navigate action with open drawer', () => {
        isDrawerOpen: true,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('baz', { answer: 42 })
+      CommonActions.navigate('baz', { answer: 42 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -280,6 +290,10 @@ it('handles navigate action with open drawer', () => {

 it('handles open drawer action', () => {
  const router = DrawerRouter({});
+  const options = {
+    routeNames: ['baz', 'bar'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -293,7 +307,8 @@ it('handles open drawer action', () => {
        isDrawerOpen: false,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      DrawerActions.openDrawer()
+      DrawerActions.openDrawer(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -317,13 +332,17 @@ it('handles open drawer action', () => {
    routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
  };

-  expect(router.getStateForAction(state, DrawerActions.openDrawer())).toBe(
-    state
-  );
+  expect(
+    router.getStateForAction(state, DrawerActions.openDrawer(), options)
+  ).toBe(state);
 });

 it('handles close drawer action', () => {
  const router = DrawerRouter({});
+  const options = {
+    routeNames: ['baz', 'bar'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -337,7 +356,8 @@ it('handles close drawer action', () => {
        isDrawerOpen: true,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      DrawerActions.closeDrawer()
+      DrawerActions.closeDrawer(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -361,13 +381,17 @@ it('handles close drawer action', () => {
    routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
  };

-  expect(router.getStateForAction(state, DrawerActions.closeDrawer())).toBe(
-    state
-  );
+  expect(
+    router.getStateForAction(state, DrawerActions.closeDrawer(), options)
+  ).toBe(state);
 });

 it('handles toggle drawer action', () => {
  const router = DrawerRouter({});
+  const options = {
+    routeNames: ['baz', 'bar'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -381,7 +405,8 @@ it('handles toggle drawer action', () => {
        isDrawerOpen: true,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      DrawerActions.toggleDrawer()
+      DrawerActions.toggleDrawer(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -406,7 +431,8 @@ it('handles toggle drawer action', () => {
        isDrawerOpen: false,
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      DrawerActions.toggleDrawer()
+      DrawerActions.toggleDrawer(),
+      options
    )
  ).toEqual({
    stale: false,
--- a/packages/routers/tests/StackRouter.test.tsx
+++ b/packages/routers/tests/StackRouter.test.tsx
@@ -240,6 +240,10 @@ it('gets state on route names change with initialRouteName', () => {

 it('handles navigate action', () => {
  const router = StackRouter({});
+  const options = {
+    routeNames: ['baz', 'bar', 'qux'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -251,7 +255,8 @@ it('handles navigate action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('qux', { answer: 42 })
+      CommonActions.navigate('qux', { answer: 42 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -280,7 +285,8 @@ it('handles navigate action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('baz', { answer: 42 })
+      CommonActions.navigate('baz', { answer: 42 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -304,7 +310,8 @@ it('handles navigate action', () => {
          { key: 'bar', name: 'bar', params: { answer: 42 } },
        ],
      },
-      CommonActions.navigate('bar', { answer: 96 })
+      CommonActions.navigate('bar', { answer: 96 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -328,7 +335,8 @@ it('handles navigate action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('unknown')
+      CommonActions.navigate('unknown'),
+      options
    )
  ).toBe(null);

@@ -342,7 +350,8 @@ it('handles navigate action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz-0', name: 'baz' }, { key: 'bar-0', name: 'bar' }],
      },
-      CommonActions.navigate({ key: 'unknown' })
+      CommonActions.navigate({ key: 'unknown' }),
+      options
    )
  ).toBe(null);

@@ -359,7 +368,8 @@ it('handles navigate action', () => {
      {
        type: 'NAVIGATE',
        payload: { key: 'baz-0', name: 'baz' },
-      }
+      },
+      options
    )
  ).toEqual({
    stale: false,
@@ -380,7 +390,8 @@ it('handles navigate action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz-0', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate({ key: 'baz-1', name: 'baz' })
+      CommonActions.navigate({ key: 'baz-1', name: 'baz' }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -398,6 +409,10 @@ it('handles navigate action', () => {

 it('handles go back action', () => {
  const router = StackRouter({});
+  const options = {
+    routeNames: ['baz', 'bar', 'qux'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -409,7 +424,8 @@ it('handles go back action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -430,13 +446,18 @@ it('handles go back action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz', name: 'baz' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toBe(null);
 });

 it('handles pop action', () => {
  const router = StackRouter({});
+  const options = {
+    routeNames: ['baz', 'bar', 'qux'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -452,7 +473,8 @@ it('handles pop action', () => {
          { key: 'qux', name: 'qux' },
        ],
      },
-      StackActions.pop()
+      StackActions.pop(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -477,7 +499,8 @@ it('handles pop action', () => {
          { key: 'qux', name: 'qux' },
        ],
      },
-      StackActions.pop(2)
+      StackActions.pop(2),
+      options
    )
  ).toEqual({
    stale: false,
@@ -506,7 +529,8 @@ it('handles pop action', () => {
        ...StackActions.pop(),
        target: 'root',
        source: 'bar-0',
-      }
+      },
+      options
    )
  ).toEqual({
    stale: false,
@@ -527,13 +551,18 @@ it('handles pop action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'baz-0', name: 'baz' }],
      },
-      StackActions.pop()
+      StackActions.pop(),
+      options
    )
  ).toBe(null);
 });

 it('handles pop to top action', () => {
  const router = StackRouter({});
+  const options = {
+    routeNames: ['baz', 'bar', 'qux'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -549,7 +578,8 @@ it('handles pop to top action', () => {
          { key: 'qux', name: 'qux' },
        ],
      },
-      StackActions.popToTop()
+      StackActions.popToTop(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -563,6 +593,12 @@ it('handles pop to top action', () => {

 it('handles push action', () => {
  const router = StackRouter({});
+  const options = {
+    routeNames: ['baz', 'bar', 'qux'],
+    routeParamList: {
+      baz: { foo: 21 },
+    },
+  };

  expect(
    router.getStateForAction(
@@ -574,7 +610,8 @@ it('handles push action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'bar', name: 'bar' }],
      },
-      StackActions.push('baz')
+      StackActions.push('baz'),
+      options
    )
  ).toEqual({
    stale: false,
@@ -582,7 +619,10 @@ it('handles push action', () => {
    key: 'root',
    index: 3,
    routeNames: ['baz', 'bar', 'qux'],
-    routes: [{ key: 'bar', name: 'bar' }, { key: 'baz-test', name: 'baz' }],
+    routes: [
+      { key: 'bar', name: 'bar' },
+      { key: 'baz-test', name: 'baz', params: { foo: 21 } },
+    ],
  });

  expect(
@@ -595,7 +635,33 @@ it('handles push action', () => {
        routeNames: ['baz', 'bar', 'qux'],
        routes: [{ key: 'bar', name: 'bar' }],
      },
-      StackActions.push('unknown')
+      StackActions.push('baz', { bar: 29 }),
+      options
+    )
+  ).toEqual({
+    stale: false,
+    type: 'stack',
+    key: 'root',
+    index: 3,
+    routeNames: ['baz', 'bar', 'qux'],
+    routes: [
+      { key: 'bar', name: 'bar' },
+      { key: 'baz-test', name: 'baz', params: { foo: 21, bar: 29 } },
+    ],
+  });
+
+  expect(
+    router.getStateForAction(
+      {
+        stale: false,
+        type: 'stack',
+        key: 'root',
+        index: 2,
+        routeNames: ['baz', 'bar', 'qux'],
+        routes: [{ key: 'bar', name: 'bar' }],
+      },
+      StackActions.push('unknown'),
+      options
    )
  ).toBe(null);
 });
--- a/packages/routers/tests/TabRouter.test.tsx
+++ b/packages/routers/tests/TabRouter.test.tsx
@@ -249,6 +249,10 @@ it('gets state on route names change', () => {

 it('handles navigate action', () => {
  const router = TabRouter({});
+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -261,7 +265,8 @@ it('handles navigate action', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz-1', name: 'baz' }, { key: 'bar-1', name: 'bar' }],
      },
-      CommonActions.navigate({ key: 'bar-1', params: { answer: 42 } })
+      CommonActions.navigate({ key: 'bar-1', params: { answer: 42 } }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -287,7 +292,8 @@ it('handles navigate action', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('baz', { answer: 42 })
+      CommonActions.navigate('baz', { answer: 42 }),
+      options
    )
  ).toEqual({
    stale: false,
@@ -313,13 +319,18 @@ it('handles navigate action', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.navigate('non-existent')
+      CommonActions.navigate('non-existent'),
+      options
    )
  ).toBe(null);
 });

 it('handles jump to action', () => {
  const router = TabRouter({});
+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -332,7 +343,8 @@ it('handles jump to action', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      TabActions.jumpTo('bar')
+      TabActions.jumpTo('bar'),
+      options
    )
  ).toEqual({
    stale: false,
@@ -347,6 +359,10 @@ it('handles jump to action', () => {

 it('handles back action with backBehavior: history', () => {
  const router = TabRouter({ backBehavior: 'history' });
+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -359,7 +375,8 @@ it('handles back action with backBehavior: history', () => {
        routeKeyHistory: ['bar'],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -382,13 +399,18 @@ it('handles back action with backBehavior: history', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toBe(null);
 });

 it('handles back action with backBehavior: order', () => {
  const router = TabRouter({ backBehavior: 'order' });
+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -401,7 +423,8 @@ it('handles back action with backBehavior: order', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -424,7 +447,8 @@ it('handles back action with backBehavior: order', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toBe(null);
 });
@@ -435,6 +459,11 @@ it('handles back action with backBehavior: initialRoute', () => {
    initialRouteName: 'bar',
  });

+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };
+
  expect(
    router.getStateForAction(
      {
@@ -446,7 +475,8 @@ it('handles back action with backBehavior: initialRoute', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toEqual({
    stale: false,
@@ -469,13 +499,18 @@ it('handles back action with backBehavior: initialRoute', () => {
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toBe(null);
 });

 it('handles back action with backBehavior: none', () => {
  const router = TabRouter({ backBehavior: 'none' });
+  const options = {
+    routeNames: ['bar', 'baz'],
+    routeParamList: {},
+  };

  expect(
    router.getStateForAction(
@@ -484,17 +519,22 @@ it('handles back action with backBehavior: none', () => {
        type: 'tab',
        key: 'root',
        index: 0,
-        routeNames: ['baz', 'bar'],
+        routeNames: ['bar', 'baz'],
        routeKeyHistory: [],
        routes: [{ key: 'baz', name: 'baz' }, { key: 'bar', name: 'bar' }],
      },
-      CommonActions.goBack()
+      CommonActions.goBack(),
+      options
    )
  ).toEqual(null);
 });

 it('updates route key history on navigate and jump to', () => {
  const router = TabRouter({ backBehavior: 'history' });
+  const options = {
+    routeNames: ['bar', 'baz', 'qux'],
+    routeParamList: {},
+  };

  let state: TabNavigationState = {
    index: 1,
@@ -514,35 +554,40 @@ it('updates route key history on navigate and jump to', () => {

  state = router.getStateForAction(
    state,
-    TabActions.jumpTo('qux')
+    TabActions.jumpTo('qux'),
+    options
  ) as TabNavigationState;

  expect(state.routeKeyHistory).toEqual(['baz-0']);

  state = router.getStateForAction(
    state,
-    CommonActions.navigate('bar')
+    CommonActions.navigate('bar'),
+    options
  ) as TabNavigationState;

  expect(state.routeKeyHistory).toEqual(['baz-0', 'qux-0']);

  state = router.getStateForAction(
    state,
-    TabActions.jumpTo('baz')
+    TabActions.jumpTo('baz'),
+    options
  ) as TabNavigationState;

  expect(state.routeKeyHistory).toEqual(['qux-0', 'bar-0']);

  state = router.getStateForAction(
    state,
-    CommonActions.goBack()
+    CommonActions.goBack(),
+    options
  ) as TabNavigationState;

  expect(state.routeKeyHistory).toEqual(['qux-0']);

  state = router.getStateForAction(
    state,
-    CommonActions.goBack()
+    CommonActions.goBack(),
+    options
  ) as TabNavigationState;

  expect(state.routeKeyHistory).toEqual([]);
--- a/packages/routers/src/DrawerRouter.tsx
+++ b/packages/routers/src/DrawerRouter.tsx
@@ -115,7 +115,7 @@ export default function DrawerRouter(
      return result;
    },

-    getStateForAction(state, action) {
+    getStateForAction(state, action, options) {
      switch (action.type) {
        case 'OPEN_DRAWER':
          if (state.isDrawerOpen) {
@@ -149,7 +149,8 @@ export default function DrawerRouter(
              ...state,
              isDrawerOpen: false,
            },
-            action
+            action,
+            options
          );

        case 'GO_BACK':
@@ -160,10 +161,10 @@ export default function DrawerRouter(
            };
          }

-          return router.getStateForAction(state, action);
+          return router.getStateForAction(state, action, options);

        default:
-          return router.getStateForAction(state, action);
+          return router.getStateForAction(state, action, options);
      }
    },

--- a/packages/routers/src/StackRouter.tsx
+++ b/packages/routers/src/StackRouter.tsx
@@ -165,7 +165,9 @@ export default function StackRouter(options: StackRouterOptions) {
      };
    },

-    getStateForAction(state, action) {
+    getStateForAction(state, action, options) {
+      const { routeParamList } = options;
+
      switch (action.type) {
        case 'PUSH':
          if (state.routeNames.includes(action.payload.name)) {
@@ -180,7 +182,13 @@ export default function StackRouter(options: StackRouterOptions) {
                      ? `${action.payload.name}-${shortid()}`
                      : action.payload.key,
                  name: action.payload.name,
-                  params: action.payload.params,
+                  params:
+                    routeParamList[action.payload.name] !== undefined
+                      ? {
+                          ...routeParamList[action.payload.name],
+                          ...action.payload.params,
+                        }
+                      : action.payload.params,
                },
              ],
            };
@@ -211,10 +219,14 @@ export default function StackRouter(options: StackRouterOptions) {
        }

        case 'POP_TO_TOP':
-          return router.getStateForAction(state, {
-            type: 'POP',
-            payload: { count: state.routes.length - 1 },
-          });
+          return router.getStateForAction(
+            state,
+            {
+              type: 'POP',
+              payload: { count: state.routes.length - 1 },
+            },
+            options
+          );

        case 'NAVIGATE':
          if (
@@ -253,14 +265,18 @@ export default function StackRouter(options: StackRouterOptions) {
            }

            if (index === -1 && action.payload.name !== undefined) {
-              return router.getStateForAction(state, {
-                type: 'PUSH',
-                payload: {
-                  key: action.payload.key,
-                  name: action.payload.name,
-                  params: action.payload.params,
+              return router.getStateForAction(
+                state,
+                {
+                  type: 'PUSH',
+                  payload: {
+                    key: action.payload.key,
+                    name: action.payload.name,
+                    params: action.payload.params,
+                  },
                },
-              });
+                options
+              );
            }

            return {
@@ -285,12 +301,16 @@ export default function StackRouter(options: StackRouterOptions) {

        case 'GO_BACK':
          if (state.index > 0) {
-            return router.getStateForAction(state, {
-              type: 'POP',
-              payload: { count: 1 },
-              target: action.target,
-              source: action.source,
-            });
+            return router.getStateForAction(
+              state,
+              {
+                type: 'POP',
+                payload: { count: 1 },
+                target: action.target,
+                source: action.source,
+              },
+              options
+            );
          }

          return null;