title: React Navigation 5 - Reset a stack (similar to popToTop()) from another stack in a different tab before navigating to it
body: <p>Suppose two stack screens in a Tab Navigator:</p>
  <blockquote>
  <ol>
  <li>Tab A -&gt; Camera</li>
  <li>Tab B -&gt; Profile</li>
  </ol>
  </blockquote>
  <p>In the profile screen, there are other screens of the same type (&quot;Profile&quot;) pushed (with different params) in its stack. Now, if you are in the &quot;Camera&quot; screen and do:</p>
  <pre><code>    navigation.navigate(&quot;Profile&quot;, { screen: &quot;Profile&quot;, params });
  </code></pre>
  <p>You will navigate to the &quot;Profile&quot; screen and those params will be sent to the last screen in the stack. What can I do if I want to navigate to the root of the stack passing the params?</p>
  <p>I have tried with:</p>
  <pre><code>   // In the profile screen
     useEffect(() =&gt; {
         if (navigation.canGoBack())
              navigation.popToTop(); // Go back to the root of the stack
  
         showParams(params);
     }, [params])
  </code></pre>
  <p>but with this, the &quot;showParams&quot; operation isn't performed in the root, and I am not navigating directly to the root of the stack from the &quot;Camera&quot; screen.</p>
  <p>I think I have to do something like this in the Camera screen before navigating:</p>
  <pre><code>  navigation.dispatch(
          CommonActions.reset({
            // some stuff
          })
    );
  
    navigation.navigate(&quot;Profile&quot;, { screen: &quot;Profile&quot;, params });
  </code></pre>
  <p>But I can't find any way to achieve my goal.</p>
  <p>Any ideas? Thank you.</p>
  <h2>UPDATE - My navigation system</h2>
  <h2>STACKS (Here I define multiple stacks: &quot;HomeStacks&quot;, &quot;SearchStacks&quot;, &quot;ProfileStacks&quot; ...)</h2>
  <pre><code>const Stack = createStackNavigator();
  
  export function ProfileStacks() { &lt;------ Over this stack I do .push()
    return (
      &lt;Stack.Navigator
        initialRouteName=&quot;Profile&quot;
      &gt;
        &lt;Stack.Screen name=&quot;Profile&quot; children={Profile} /&gt;
        &lt;Stack.Screen name=&quot;EditProfile&quot; children={EditProfile} /&gt;
      &lt;/Stack.Navigator&gt;
    );
  }
  
  ...
  </code></pre>
  <h2>BOTTOM TAB NAVIGATOR</h2>
  <pre><code>&lt;Tab.Navigator&gt;
    &lt;Tab.Screen
      name=&quot;Camera&quot;
      component={CameraPlaceholder}
      listeners={({ navigation }) =&gt; ({
        tabPress: (event) =&gt; {
          event.preventDefault();
          navigation.navigate(&quot;CameraModal&quot;);
        },
      })}
    /&gt;
  
    &lt;Tab.Screen
      name=&quot;Profile&quot;
      component={ProfileStacks}
    /&gt;
  &lt;/Tab.Navigator&gt;
  </code></pre>
  <h2>ROOT STACK NAVIGATOR (The main navigator of the app)</h2>
  <p>In this stack I implement the authentication flow and also, I declare some extra stacks (just for look-and-feel purposes).</p>
  <pre><code>export default function RootNavigator(props) {
    /* 
      This navigator is implemented using the
      'Protected Routes' pattern
    */
    const { isUserLoggedIn } = props;
  
    const RootStack = createStackNavigator();
  
    return (
      &lt;RootStack.Navigator&gt;
        {isUserLoggedIn ? (
          &lt;&gt;
            &lt;RootStack.Screen
              name=&quot;BottomTabNavigator&quot;
              component={BottomTabNavigator}
            /&gt;
  
            &lt;RootStack.Screen
              name=&quot;CameraModal&quot;
              component={Camera}
            /&gt;
          &lt;/&gt;
        ) : (
          &lt;&gt;
            &lt;RootStack.Screen name=&quot;SignIn&quot; component={SignIn} /&gt;
  
            &lt;RootStack.Screen
              name=&quot;SignUp&quot;
              component={SignUp}
            /&gt;
  
            &lt;RootStack.Screen
              name=&quot;ForgotPassword&quot;
              component={ForgotPassword}
            /&gt;
          &lt;/&gt;
        )}
      &lt;/RootStack.Navigator&gt;
    );
  </code></pre>
  <h2>Related problems I have seen</h2>
  <p><a href="https://stackoverflow.com/questions/61089237/how-to-reset-a-stack-in-a-different-tab-using-react-navigation-5-x">How to reset a Stack in a different Tab using React Navigation 5.x</a></p>
  <p><a href="https://github.com/react-navigation/react-navigation/issues/6639" rel="nofollow noreferrer">https://github.com/react-navigation/react-navigation/issues/6639</a></p>
  <p><a href="https://github.com/react-navigation/react-navigation/issues/8988" rel="nofollow noreferrer">https://github.com/react-navigation/react-navigation/issues/8988</a></p>
  <h2>This is my Profile tab's navigation data</h2>
  <pre><code>  Object {
          &quot;key&quot;: &quot;Profile-Ty4St1skrxoven-jkZUsx&quot;,
          &quot;name&quot;: &quot;Profile&quot;,
          &quot;params&quot;: undefined,
          &quot;state&quot;: Object {
            &quot;index&quot;: 1,
            &quot;key&quot;: &quot;stack-8nWDnwDJZRK8iDuJok7Hj&quot;,
            &quot;routeNames&quot;: Array [
              &quot;Profile&quot;,
              &quot;EditProfile&quot;,
            ],
            &quot;routes&quot;: Array [
              Object {
                &quot;key&quot;: &quot;Profile-m0GQkvNk5RjAhGABvOy9n&quot;,
                &quot;name&quot;: &quot;Profile&quot;,
                &quot;params&quot;: undefined,
              },
              Object {
                &quot;key&quot;: &quot;Profile-tZAEmSU0eEo1Nt7XC09t1&quot;,
                &quot;name&quot;: &quot;Profile&quot;,
                &quot;params&quot;: Object {
                  &quot;otherUserData&quot;: Object {
                    &quot;username&quot;: &quot;jeffbezos&quot;,
                  },
                  &quot;post&quot;: null,
                },
              },
            ],
            &quot;stale&quot;: false,
            &quot;type&quot;: &quot;stack&quot;,
          },
        },
      ],
      &quot;stale&quot;: false,
      &quot;type&quot;: &quot;tab&quot;,
    },
  </code></pre>
  <p>I just need to pop the second route from the stack &quot;Profile&quot; which is in the tab &quot;Profile&quot; from another Tab of my app, and then navigate to this screen.</p>