Error: There is no route defined for key Location. Must be one of: 'root','modal'

[tanerparcali]

Any ideas on this? Why am I getting this error? It's fine when I don't use Modal, but this is the error I get when I try to generate a Modal window.

"react-native": "0.70.6", with TypeScript template

"react": "18.1.0", "react-native": "0.70.6", "react-native-animatable": "^1.3.3", "react-native-gesture-handler": "^2.8.0", "react-native-reanimated": "^2.13.0", "react-native-router-flux": "^4.3.1", "react-native-safe-area-context": "^4.4.1", "react-native-screens": "^3.18.2",

<Router>
      <Modal>
        <Stack key="root" hideNavBar>  
          <Scene key="Control" initial component={Control} type="reset" back={false} />
          <Scene tabs={true} showLabel={false} hideNavBar tabBarStyle={styles.tabBar} type="reset">
            <Scene key="Account" component={AccountPage} hideNavBar icon={AccountIcon} title='Account' lazy on={() => appState.setCurrentScreen('AccountPage')} />
          </Scene>
        </Stack>
        <Scene  key="modal" component={ItemList} /> 
        </Modal>
    </Router>

[salorsino]

You wouldn't want to put your modal as the root element. You should navigate to a page where this navigation stack can be presented in a Modal.

[tanerparcali]

My App.tsx

<Router>
      <Modal>
              <Stack key="root" hideNavBar>  
                <Scene key="Control" initial component={Control} type="reset" back={false} />
                <Scene tabs={true} showLabel={false} hideNavBar tabBarStyle={styles.tabBar} type="reset">
                  <Scene key="Account" component={AccountPage} hideNavBar icon={AccountIcon} title='Account' lazy on={() => appState.setCurrentScreen('AccountPage')} />
                </Scene>
              </Stack>
        <Scene  key="modal" component={ItemList} /> 
        </Modal>
    </Router>

Actually this was working fine in different projects, I couldn't find what's wrong here. Opening this page as a modal view when entering the key="modal" page that should be in the router code above.

For example, I'm on the "Account" page and when I try to navigate to this page as Actions.modal(), the application throws an error.