React Navigation Reset History

Question

I have 3 screens, A, B, and C.

A goes to a form B that when completed, goes to C. When you press back from C, I don't want to go back to temporary form B, but back to A.

Is there a way for, when going from A to C, to reset the navigation history from A->B->C to A->C ?

I tried something like:

        navigation.dispatch(
            CommonActions.reset({
              index: 0,
              routes: [
                {name: 'C', params:{data:data}},
                { name: 'B', params:{album: route.params.product, id: route.params.data.id} },
                { name: 'A'},

              ],
            })
          );

but it doesn't work, logging The action 'GO_BACK' was not handled by any navigator. errors. I'm thinking it's because the index is 0. Is there a way to add an index 1, 2,3..etc to add more history?

Answer 1

You could try the different options such as .navigate, .push from the official docs https://reactnavigation.org/docs/navigating

Answer 2

You should use the replace api of navigation when you navigating from B to C.

//In B page
navigation.replace("C",{key:value}).

The replace action will remove B and push C on the stack.