React-native-router-flux: Actions.reset: There is no route defined for Key X

[asd8855]

Version

• react-native-router-flux v4.0.1
• react-native v0.56.0

      <Tabs key="main" tabBarPosition="bottom" swipeEnabled={false} animationEnabled={false} labelStyle={styles.tabLabelStyle} tabBarStyle={styles.tabBarStyle} tabStyle={styles.tabStyle} activeTintColor="#FF4459" leftTitle=" " onLeft={() => {
          console.log("onLeft");
        }}>
        <Scene key="HomeIndexPage" component={HomeIndexPage} tabBarLabel="首页" style={{ paddingBottom: 10 }} title="首页" hideNavBar={true} icon={state => {
            let source = state.focused ? require("../../res/tab/home-icon-active.png") : require("../../res/tab/home-icon-normal.png");
            return <TabIcon source={source} />;
          }} />
        <Scene key="MoreIndexPage" component={MoreIndexPage} tabBarLabel="工作" title="工作" hideNavBar={true} icon={state => {
            let source = state.focused ? require("../../res/tab/work-icon-active.png") : require("../../res/tab/work-icon-normal.png");
            return <TabIcon source={source} />;
          }} onEnter={() => {
            Actions.refs.MoreIndexPage.table();
          }} />
        <Scene key="MineIndexPage" component={MineIndexPage} tabBarLabel="我的" title="我的" hideNavBar={true} icon={state => {
            let source = state.focused ? require("../../res/tab/me-icon-active.png") : require("../../res/tab/me-icon-normal.png");
            return <TabIcon source={source} />;
          }} onEnter={() => {
            Actions.refs.MineIndexPage.refreshHeaderView();
          }} />
      </Tabs>
    </Scene>
    <Scene key="confirmDialog" component={ConfirmDialog} />
  </Lightbox>
</Router>;

---

EDIT done by @daviscabral

Steps to reproduce

• Upgrade from 4.0.0-beta.31 to 4.0.1
• Reset from a nested scene targeting a scene that is not in the first level

[asd8855]

when I use "Action.reset("xxx")",it will show

[mswokk]

Same here.

• RN 0.54.0
• RNRF 4.0.1

Under 4.0.0-beta.31 has no problem.
After upgrading to 4.0.1 it throws error.

Here is my hierarchy and error message

<Router key="root">
            <Lightbox>
                <Scene key="rootScene">
                    <Scene
                        initial
                        key="entryScreen"
                        type={ActionConst.RESET}
                        component={EntryScreen}
                    />
                    <Scene
                        key="appOnboarding"
                        component={AppOnboarding}
                    />
                  (... ommit)
               </Scene>  

                <Scene
                    hideNavBar
                    key="dialog"
                    component={YDialog}
                />

                <Scene
                    hideNavBar
                    key="bottomDrawer"
                    component={BottomDrawer}
                />

                <Scene
                    hideNavBar
                    isModal
                    key="questionnaireResultModal"
                    component={QuestionnaireResult}
                />
          </LightBox>
</Router>

And I called Actions.appOnboarding() from EntryScreen which is initial scene
Error says ....

 Error: Error: There is no route defined for key appOnboarding.
 Must be one of: 'rootScene','dialog','bottomDrawer','questionnaireResultModal'

 This error is located at:
     in Navigator (at createNavigationContainer.js:376)
     in NavigationContainer (at Router.js:97)
     in App (at Router.js:122)

It looks doesn't recognize child s more then 2 depth

[mswokk]

I create a minimal project to reproduce this bug.
https://github.com/mswokk/RNRF4_test/commits/master

I found using LightBox + ActionType.RESET => this combination makes problem.

[daviscabral]

Nice, thanks, I'll take a look when possible and update the ticket.

[daviscabral]

Also guys, there a couple of things here that I noticed that are not supported anymore - due react-navigation@2 breaking changes:

• swipeEnabled={false} and animationEnabled={false} will not work anymore as you can read about it here: react-navigation/issues/4146 and here

I am checking the provided code now to see what is happening.

[daviscabral]

I found that the problem is not actually the combination between LightBox and ActionType.RESET - but the way RESET is handled now that RNRF does not manage state anymore.

What is going on - is that RESET is always called on the top stack. I'll look here what can be done in that matter.

[daviscabral]

Hey guys - I was able to fix the issue - just being sure that is not going to break anything else before creating a PR for it.

Just to be clear about the fixes I am going to push:

• Reset is now going to work with the right stack/scope - respecting nested scenes;
• When using the scene aliases (Actions.[key]) for a scene that has a type RESET, it will also respect the scope.

Thank you for the patience and for keeping the discussion clear and objective here.

/cc @asd8855 @mswokk @andrew @joenoon @januswel

[Kiran0791]

I installed the latest package today "react-native-router-flux": "^4.0.1" but i don't find the above fix.
Can someone help me on how to pull these changes

[RodrigoCS]

@Kiran0791
I believe the last changes are not on npm, right now you could do react-native-router-flux@https://github.com/aksonov/react-native-router-flux/

[daviscabral]

This should do the trick:

yarn add aksonov/react-native-router-flux

[yqz0203]

@daviscabral I installed aksonov/react-native-router-flux but not working。😂😂

[Kiran0791]

aksonov/react-native-router-flux

Even after this reset not working. Its says There is no route defined for key signup.
Must be one of: 'lightbox'. When lightbox is used it throws this error

[asd8855]

Did you solve this problem in version 4.0.5? I still had this problem in version 4.0.5
Error: There is no route defined for key main.
Must be one of: 'root','confirmDialog'

[aksonov]

Please try replace action

On 8 Oct 2018, at 12:09, 阿斯顿 [e-mail] wrote:

Did you solve this problem in version 4.0.5? I still had this problem in version 4.0.5
Error: There is no route defined for key main.
Must be one of: 'root','confirmDialog'

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub, or mute the thread.

[asd8855]

@aksonov Replace 'reset' with 'replace'?

[aksonov]

Yes, use type=replace for routes you want to use instead current one

On Monday, October 8, 2018, 阿斯顿 [e-mail] wrote:

@aksonov https://github.com/aksonov Replace 'reset' with 'replace'?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/RNRF/react-native-router-flux/issues/3194#issuecomment-427782658,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABQpcYT_GXk3n72VK5imxRnVxxT54Paiks5uiyU7gaJpZM4WFDKH
.

[hsynlove]

@aksonov I have the same problem when i update my version to 4.0.5, for some reason i have to use 'reset' instead of 'replace'. What can i do?

[hsynlove]

I find a way to avoid this problem by add a new scene 'Route' in the first place of 'Pages'.

<Lightbox>
            <Scene initial key="Start" component={StartScreen}/>
            <Scene key="Pages">
                <Scene key="Route" component={Route}/>
                <Scene key="Login" component={Login}/>
                <Scene key="Main" component={Main}/>
            </Scene>
</Lightbox>

import {Actions} from 'react-native-router-flux';

const Route = (props) => {
    const {target, params} = props;
    Actions.replace(target, params);
    return null;
};

const {reset} = Actions;

Actions.reset = (target, params) => {
    const props = {target};
    if (params) {
        props.params = params;
    }
    reset('Pages', props);
};

export default Route;

then I can use Actions.reset('Login') or Actions.reset('Main') normally. I hope this can help

[asd8855]

@hsynlove the 'Root' is empty page？

[hsynlove]

@asd8855 yes, and this page can resolve this problem though it doesn't look elegant.

[afilp]

Hi, 'replace' is not the same with 'reset' because we need to make sure that no history is tracked anymore (with back buttons, etc.) when the user logs out.

@aksonov Do you think this can be solved in a clean way? Thanks!

[ayushnawani]

facing the same issue here. reset not working for nested scenes with lightbox.

[spadgeaki]

@aksonov Hi, we are still experiencing the same issue in latest version.

[acollazomayer]

@aksonov same here. Just upgrade from beta to 4.0.6 and push is not working

[manithin]

same here. Reset is not working and sometimes weirdly push too is not working

[DimForCity]

yes, reset not working for nested scenes with lightbox.

[Dineshchitta]

Hi @aksonov , Trying to update
react-native-router-flux from 4.0.0-beta.22 to 4.0.6
react-navigation from 1.0.0-beta.26 -> 2.18.3
React native 59.10

Still facing this issue. If I use REPLACE instead of RESET I am not getting any issue. But the app is not behaving in expected behavior.

[malithjkmt]

Not working on react-native-router-flux 4.0.6 for the same scenario (Lightbox, reset)

    "react": "16.8.6",
    "react-native": "0.60.4",

Until this resolves, downgraded back to react-native-router-flux 4.0.X
@aksonov @daviscabral @asd8855 any insights ?

[sunnymopada]

@aksonov can you please reopen the issue?

[hectorsuarezm]

Same as @malithjkmt this still not working

"react": "16.9.0", "react-native": "0.61.5", "react-native-router-flux": "4.0.6"

any work around that doesn't affect the app behaviour (type="replace") ?

[mylesshie]

same error, "react-native-router-flux": "^4.2.0",

[tuandv1311]

still error, "react-native-router-flux": "4.2.0". "react-native": "0.60.4"

[sametpalitci]

Action.reset("key") the problem is fixed for me

[Nico-Guyon]

I also have the same problem with "react-native-router-flux": "^4.2.0".
Action.reset('X') gives me: There is no route defined for Key X

[yestay90]

I also face the same problem. When I add type='reset' to scene it works ok when connected to metro. But when creating build it shows error on alert that There is not route defined for Key x.

[malithjkmt]

After 2 years, upgraded to "react-native-router-flux": "^4.3.1". Still facing the same issue