CODEWITHSUNDEEP
react-native
Iris Schaffer
Iris Schaffer

Reputation: 854

react-native-router-flux - Resetting navigation stack in tab

What we want

We use react-native-router-flux in our application and find ourself in a situation where we need to reset the navigation stack (at least) for one tab. This is our scene structure:

tabs
  listTab
    listView
    recordingView
  creationTab
    recordView
    descriptionView
    publishView

Concretely, our application lets users create and view recordings. There's a listTab, with two sub-scenes (list of recordings and view a single recording) and a tab for creating (creationTab) recordings with several steps (recordView, descriptionView, publishView). After the last step, the recording is published and we redirect to the viewRecording scene for that recording in the listTab. When pressing the creationTab again, we would like to get back to the first scene of the creation process again, but instead we of course land on the last step (publishView) again.

What we tried

After reading through the documentation and issues connected to this, we figured the option reset might help us. However, if we try to add type='reset' to the props of creationTab, when pressing the tab, all other tab icons disappear (as documented in this issue).

So instead, we then tried to set the type of our push from publishView to recordingView to reset, but that also did not work (although the right action is dispatched and the back button is removed on the new scene, when hitting the recordingTab icon again, we still get back to our old publishView).

We also though about using Switches, to unmount the components but it doesn't seem like this is how they were intended to be used...

Versions

We're now getting a bit desperate after days spent on issues like this and similar ones and I am not sure how we should proceed. Has anybody experienced similar problems or found a solution?

Upvotes: 3

Views: 1483

Answers (1)

Arthur Parmentier
Arthur Parmentier

Reputation: 11

I faced the same issue. As a temporary workaround, I do not use the reset option but instead follow the redirection immediately with a pop action.

In my case, my view is only one level deep so this is not too dirty. I'll look for a cleaner solution but I hope it can help in the meantime.

react-native: 0.35.0-rc

react-native-router-flux: 3.35.0

Upvotes: 1

Related Questions