React Navigation v5: Reset Stack Inside Tab After Leaving Tab

• react-navigation

  66 23,215 9.3 TypeScript

  Routing and navigation for your React Native apps

  

  // ... // https://github.com/react-navigation/react-navigation/issues/8583 const TAB_TO_RESET = 'HomeTab'; const resetHomeStackOnTabPress = ({ navigation, route }) => ({ tabPress: (e) => { const state = navigation.dangerouslyGetState(); if (state) { // Grab all the tabs that are NOT the one we just pressed const nonTargetTabs = state.routes.filter((r) => r.key !== e.target); nonTargetTabs.forEach((tab) => { // Find the tab we want to reset and grab the key of the nested stack const tabName = tab?.name; const stackKey = tab?.state?.key; if (stackKey && tabName === TAB_TO_RESET) { // Pass the stack key that we want to reset and use popToTop to reset it navigation.dispatch({ ...StackActions.popToTop(), target: stackKey, }); } }); } }, }); function App() { return ( Tab.Navigator> NavigationContainer> ); } export default App;

• SurveyJS

  surveyjs.io

  sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

Suggest a related project