Pressing back button not working as expected

[crossRT]

Version

Tell us which versions you are using:

• react-native-router-flux 4.0.0-beta.21
• react-native v0.46.4

Expected behaviour

When I click the back button, it SHOULD go back to the previous page.

Actual behaviour

When I press the back button, it goes back to the initial page.

Steps to reproduce

I have following scenes:

<Router>
  <Scene key="drawer" contentComponent={this.renderSideBar} drawer>
    <Scene key="splashScreen" component={SplashScreen} initial hideNavBar/>
    <Scene key="login" component={Login} hideNavBar/>
    <Scene key="tripList" component={TripList} title="Trip List"/>
    <Scene key="tripDetails" component={TripDetails} title="Trip Detail" back/>
  </Scene>
</Router>

I enter to tripDetails from tripList, when I click the back button of top left of tripDetails, it goes back to inital Splash Screen page.
I also tried trigger Actions.pop() with the onLeft event, but it's the same.
My problem is: how should I make the "back" function working like usual, going back to the previous page in the stack, which is the tripList page.

[mvanroon]

I believe this is because they're Drawer child scenes.
Try this:

<Router>
  <Scene key="drawer" contentComponent={this.renderSideBar} drawer>
    <Scene key="splashScreen" component={SplashScreen} initial hideNavBar/>
    <Scene key="login" component={Login} hideNavBar/>
    <Scene key="trips">
      <Scene key="tripList" component={TripList} title="Trip List" initial />
      <Scene key="tripDetails" component={TripDetails} title="Trip Detail" back/>
    </Scene>
  </Scene>
</Router>

[mcabs3]

@mvanroon is correct, your current setup suggests that both of those Scenes are at the same navigational level, you are expecting them to be in a Stack like navigational structure. Only change is that you shouldn't need the back attribute in tripDetails on his response.

[crossRT]

got it.
Thank you so much. @mvanroon @mcabs3
=)