React-native-router-flux: Best Way to Navigate to a Scene from Different Parent?

Created on 3 Aug 2016  路  5Comments  路  Source: aksonov/react-native-router-flux

Version

Tell us which versions you are using:

  • react-native-router-flux v3.30.1
  • react-native v0.30.0

Let's say we have

<Scene key="a" type="reset">
    <Scene key="aa" />
    <Scene key="ab" />
</Scene>
<Scene key="b" type="reset">
    <Scene key="ba" />
    <Scene key="bb" />
</Scene>

And current scene is "bb", whats the best way to construct "a" and go to "ab" with a back button to "aa"?
Should I call these two

Actions.a();
Actions.ab();

Or is there any way to do it in one call?

I know Github issues is not the place for asking questions, but I couldn't find any answers in documentation, or the example or previous Github issues, the closest one I found was https://github.com/aksonov/react-native-router-flux/issues/645 with a link to nowhere at the bottom.

Most helpful comment

@jadidian what I had to do to accomplish that is have an "initial" scene in each parent that is just kind of a shell so when I dispatch a navigation action that gets passed to that scene telling it which child scene to load. It should technically be able to be done by pass props to the scene when you call the action, but I've had issues with the props getting passed to the scene.

So in the shell scene I have something like this in the render.

render() {
    const Component = this.props.screen === 'SignUp' ? SignUp : Login;

    return <Component />;
}

screen is set on the main state and that's mapped to the shell component. I've also had issues with the nav bar so I just made my own and keeps track of back buttons and whatnot using navigation actions and my state. Seems to work well. Not sure if it's the best way but it seems pretty clean and hasn't had any issues so far.

All 5 comments

@jadidian what I had to do to accomplish that is have an "initial" scene in each parent that is just kind of a shell so when I dispatch a navigation action that gets passed to that scene telling it which child scene to load. It should technically be able to be done by pass props to the scene when you call the action, but I've had issues with the props getting passed to the scene.

So in the shell scene I have something like this in the render.

render() {
    const Component = this.props.screen === 'SignUp' ? SignUp : Login;

    return <Component />;
}

screen is set on the main state and that's mapped to the shell component. I've also had issues with the nav bar so I just made my own and keeps track of back buttons and whatnot using navigation actions and my state. Seems to work well. Not sure if it's the best way but it seems pretty clean and hasn't had any issues so far.

Can we have a more detailled example?

Thx

Can we get an update on this? I'm trying to navigate to a child scene within a tab and it does not work if I do Actions.childSceneKey()

I'd love to help more, but TBH I've given up on trying to use this module for all my navigation. I'm only using it to navigate to completely new views. I've built my own solutions for the navbar, back button, modals, and child scene navigation. The documentation just isn't complete enough and there seem to be a lot of bugs in the actual module.

experiencing same issue as @amitava82

Was this page helpful?
0 / 5 - 0 ratings

Related issues

booboothefool picture booboothefool  路  3Comments

jgibbons picture jgibbons  路  3Comments

fgrs picture fgrs  路  3Comments

GCour picture GCour  路  3Comments

rafaelcorreiapoli picture rafaelcorreiapoli  路  3Comments