Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

164
Views
React Navigation Slide Animation goBack Button error

I get this error:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
    in Card (at CardContainer.tsx:206)
    in CardContainer (at CardStack.tsx:623)
    in RNSScreen (at createAnimatedComponent.js:217)
    in AnimatedComponent (at createAnimatedComponent.js:278)
    in AnimatedComponentWrapper (at src/index.native.tsx:147)
    in Screen (at Screens.tsx:74)
    in MaybeScreen (at CardStack.tsx:616)

This is my navigator:

const DefaultStackNavigation = () => {
  return(
    <NavigationContainer fallback={<View style={{backgroundColor: "#0C0C0C", height: "100%", width: "100%", flex: 1}} />}>
      <Stack.Navigator screenOptions={{headerShown: false, gestureEnabled: true, gestureDirection: "horizontal", cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS, cardStyle: {backgroundColor: "transparent", flex: 1, height: "100%", width: "100%"}}} independent={false}>
        <Stack.Screen name="HomeTabs" component={HomeScreen} />
        <Stack.Screen name="ChatScreen" component={ChatScreen} />
        <Stack.Screen name="Settings" component={SettingsScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

Because I have gestureEnabled= true I can swipe the screen to the right to go back. But now there is a problem:

I want the user to choose wether he/she want's to swipe to go back or if he/she want's to click on the go back button. If I swipe the screen to the right I don't get an error and I can use the app. But if I click on my navigation.goBack() button in my ChatScreen I get the error (beginning of this post). If I than enable the header and click on the goBack button I don't get this error too. How can I prevent React Native to behave this way?

Edit

This is my goBack button:

<View style={styles.backArrowContainer}>
  <TouchableOpacity style={{height: 60, width: 60, justifyContent: "center", alignItems: "center"}} onPress={() => navigation.goBack()}>
    <BackArrow />
  </TouchableOpacity>
</View>
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!