Questions tagged [react-navigation-stack]

640 questions
45
votes
23 answers

White background flashing when switching screens - React-Navigation v5

I'm migrating a RN project version 4 to 5. When switching screens there was an issue with a white background flashing in. In v4 this was solved by setting cardStyle: { backgroundColor: material.containerBgColor } in the StackNavigation…
haxpanel
  • 4,402
  • 4
  • 43
  • 71
34
votes
20 answers

Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider error with @react-navigation/stack

When I am trying to use import {createStackNavigator} from @react-navigation/stack, it gives me an error Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider I have tried finding a solution, but nothing helps.
32
votes
1 answer

Couldn't find a navigation object. Is your component inside a screen in a navigator?

In My below code when I use useNavigation() then it gives an error like my quiestion How to use useNavigation, Please any one can solve this error... ERROR:Couldn't find a navigation object. Is your component inside a screen in a navigator? I…
23
votes
9 answers

Unable to resolve "@react-navigation/native" from "App.js" - React Native + How to Solve?

undefined Unable to resolve module @react-navigation/native from App.js: @react-navigation/native could not be found within the project. If you are sure the module exists, try these steps: 1. Clear watchman watches: watchman watch-del-all 2.…
22
votes
6 answers

React Native clear the previous screen from the navigation stack

I am developing a React native application for learning purposes. I am now implementing navigation using React Navigation. I am using stack navigation. But I cannot find a way to remove the previous screen from navigation history and kill the app. …
Wai Yan Hein
  • 13,651
  • 35
  • 180
  • 372
21
votes
3 answers

Where to put all the screens which are common in multiple stack navigators? - React Navigation v5

Following is the hierarchy of my app navigators ├── appNavigator ( Bottom Tab Navigator) ├── feed (Stack Navigator) postDetailScreen pageDetailScreen ProfileDetailScreen ...other screens ├── notifications (Stack…
21
votes
4 answers

How to mock useNavigation hook in react-navigation 5.0 for jest test?

i want to mock useNavigation hook used inside my functional component. Any workaround how to mock it using jest? import React from 'react'; import { useNavigation } from '@react-navigation/native'; import { TouchableOpacity } from…
19
votes
2 answers

How to reset nested navigators (react-navigation v5)

Having two sets of stack navigators; const SetOneScreens = () => (
17
votes
6 answers

How to properly type useNavigation in React Navigation?

I'm trying to type the useNavigation from React Navigation. I would like to be able to pass only the name of the route, but I get an error unless I also pass props for that route. Following the documentation, I understand the implementation should…
Nix
  • 5,746
  • 4
  • 30
  • 51
16
votes
3 answers

navigation.navigate is not a function

I'm using navigation to navigate my react native app and I couldn't Paypass this issue. I did as the docs but nothing works for me. The problem is I'm trying to use the navigation option to add a header and right button to navigate me to another…
Ahmad Alsehaim
  • 163
  • 1
  • 1
  • 5
14
votes
2 answers

How to resolve React native navigation Error while installing version 6

I just installed react navigation version 6 and i received below error Attempt to invoke interface method boolean com.swmansion.reanimated.layoutReanimation.NativeMethodsHolder.isLayoutAnimationEnabled() on a null object reference below is my…
14
votes
4 answers

withNavigation can only be used on a view hierarchy of a navigator

I'm getting the error: Invariant Violation: withNavigation can only be used on a view hierarchy of a navigator. The wrapped component is unable to get access to navigation from props or context I don't know why, because I'm using…
13
votes
1 answer

React Navigation custom navigator transitions

I'm looking to create a Stack Navigator that can handle animating specific elements between 2 screens. Fluid Transitions looked like a library I could use, but it doesn't support react-navigation 5.X. If there's a package that has this functionality…
13
votes
4 answers

React Native React Navigation Header Button Event

Hello I 'm trying to bind a function in my Navigator Right Button, But It gives error. This is my code: import React, { Component } from 'react'; import Icon from 'react-native-vector-icons/FontAwesome'; import Modal from…
12
votes
2 answers

React Navigation header title in nested tab navigator

I have a Tab Navigator inside a Stack Navigator and I want the header title to be dynamically configured as the title of the tab selected. Like there's 3 tabs: Home, Profile, Add Item and I want the header title to be "Home" when in the home tab,…
1
2 3
42 43