react-navigation

问题 I'm using material Bottom Tab Navigator, My app is structured such that, some tabs contain a stack navigator. I want to hide the bottom tabs when a user navigates to another stack in the stack navigator. I'm using react navigation v5. I don't want the bottom tabs showing when a user has already navigated to a stack. 回答1: I made you a basic example of what you're asking. I hope this what you're looking for : import React from 'react' import { Button, View, Text, StyleSheet } from 'react-native

问题 I have a back button that takes the user a screen back, but when there are no screens left to go back, I want it to do something else so this is my code: <Button onPress={()=>{ if(CanGoBack){ // imaginary 'CanGoBack' variable this.props.navigation.goBack() }else{ this.doSomething() } }}/> how can I achieve this? 回答1: There is a function in this.props.navigation called dangerouslyGetParent . You can see it in the documentation here. It states the following in the documentation: Another good

问题 So I have this requirement. To make tab navigation with this exact appearance: I had no problem styling the tab bar with the gradient and the buttons. I created my own custom one with this code: export default createBottomTabNavigator({ (... routes here) }, { initialRouteName: "Inspiration", tabBarComponent: props => <BottomTabBar {...props} /> }) But now I'm having trouble with the middle button. My bar looks like this: If I remove the custom tab bar removing this line: tabBarComponent:

问题 The structure of my react navigation is like this : BottomTabNavigator => Navigator => Components This is the skeleton of the App.js. The whole application is wrapped up in a bottom tab navigation. import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; const BottomTab = createBottomTabNavigator(); function App() { return ( <NavigationContainer> <BottomTab.Navigator > <BottomTab.Screen name="Main" component={MyVeranda} options={{ tabBarLabel: 'Home', tabBarIcon: //...some

问题 I'm having a problem where every dispatch causes the navigator to redirect to my initialRouteName . Because of my componentDidUpdate methods, I eventually land on the correct screen, but only in some cases. I have used ReactNavigation several times before without any problems. The only thing that stands out is that <NavigationContainer onStateChange is getting called once for all dispatch'd action, not just those under the navigator reducer. Is that normal? root.js import 'react-native

问题 I am facing a problem since few weeks, I am using react-navigation in my react-native app, when I test on my device in debug mode I navigate properly between screens but when I build a signed apk, the navigation does not work anymore. I try everything but nothing is working. I am using react-native 0.61.2, react-navigation 4.0.10 This is my app/build.gradle file project.ext.react = [ entryFile: "index.js", enableHermes: false, // clean and rebuild if changing ] apply from: "../../node_modules

问题 I’m using materialTopTabs and it seems like this loads all the screens in the navigator once its mounted. I have a screen List and inside it a tab navigator with 2 screens: Posts and Users . These two screen both depend on params passed from List . However, i am only able to pass params to one of the screens using this method: navigation.navigate('PostsTabNav', { params: { network: item, }, screen: 'NetworkPosts' //or NetworkUsers }); I have tried to pass the params to my navigator directly

问题 I’m using materialTopTabs and it seems like this loads all the screens in the navigator once its mounted. I have a screen List and inside it a tab navigator with 2 screens: Posts and Users . These two screen both depend on params passed from List . However, i am only able to pass params to one of the screens using this method: navigation.navigate('PostsTabNav', { params: { network: item, }, screen: 'NetworkPosts' //or NetworkUsers }); I have tried to pass the params to my navigator directly

问题 I want to focus on a textinput when I navigate to a new screen. This works when I add a screen to the stack, but not when I go back in the stack. Instead, the input focuses for a second and blurs immediately. Here is what I get: Screen A is first in the stack and input blurs immediately Screen B is added to the stack and works as intended Any idea what is causing this? FYI, I have the same issue if I use autoFocus. Here is the whole (pretty straight forward) code: import { NavigationContainer

问题 Please feel free to point me in the correct direction if this has been answered elsewhere, but I can't find it via here, or Google. Maybe I just don't know this correct name for this thing? I am currently working with React-navigation (for react-native) and I wonder if it is possible to make one icon in the center of the tab bar larger than the others, in particular with transparency behind it when the page scrolls. Mock up here for an example: Larger icon in middle overlaying scrollable area