react-navigation

问题 I'm developing a react-native app with a bottom-tab-navigator, and would like navigation options to depend on the screen being displayed, something like: AppNavigator.js: class AppNavigator extends React.Component{ isRouteEnabled = (routeName) => { return this.props.route == routeName; } render() { const tabNavigator = createBottomTabNavigator({ Home: HomeScreen, Screen2: Screen2, // tab to be conditionally displayed ...(this.isRouteEnabled('Screen3') ? { Screen3 : Screen3} : {}) }); const

问题 Following on from my last question Switch Navigator and Tab Navigator Conflict the previous error was fixed. Now I encouter a new error - I navigate to page VenueDetail in my HomeNavigator then switch from Favourites to Dashboard in my tab navigator for this error to be thrown TypeError: subs is not a function. (In 'subs(payloadWithType)', 'subs' is an instance of Array) any ideas? import React from "react"; import { Platform, Text } from "react-native"; import { createAppContainer,

问题 I'm currently developing a React Native app and I'm trying to implement a drawer navigation which, when the user is logged out shows a different layout and when the user logs in shows a different layout. I tried using state in the Drawer Navigation file to check if the user is logged in or not and then return appropriate drawer navigator but the navigation only updates when the app is launched. Is there a way to implement this? Custom Drawer Navigator code: `export default class MainWrapper

问题 I have a scene that show some monuments in my city. When I press a marker (monument) it shows the name of the monument. What I want to do is, when I press that name I want to transit to a determined scene (with react-navigation). I wrapped the name of monument with a TouchableHighlight and on press I call the 'navigate' method. But it simply dont transit, it does nothing. Not even an error. Here is my code: render(){ const { navigate } = this.props.navigation; const { data } = this.props

问题 I'm trying to integrate StackNavigator, TabNavigator and DrawerNavigator like this: class TestApp extends Component { render() { return ( <MyApp /> ); } } const Tabs = TabNavigator({ Home1: { screen:Home1 }, Home2: { screen:Home2 }, }, { tabBarPosition: 'bottom', }); const Drawer = DrawerNavigator({ First:{ screen: DrawerScreen1 }, Second:{ screen: DrawerScreen2 } },{ initialRouteName:'First', drawerPosition: 'left' }); const MyApp = StackNavigator({ Screen1: {screen:Screen1}, Screen2:

问题 I read here that using the the createStackNavigator as a Component class was possible, and I was trying to achieve that, but I always got an error. Instead of this: export default createStackNavigator({ Messages }, { defaultNavigationOptions: { gesturesEnabled: false } }) I tried this: class MessagesStack extends React.Component { render() { const RouteConfigs = { Messages }; const NavigatorConfigs = { defaultNavigationOptions: { gesturesEnabled: false } }; const Stack = createStackNavigator

问题 I was trying to open a modal from bottomnavigator , was following this tutorial - https://snack.expo.io/SyJKMkFUM I am using react-navigation -3.0.9 here is my app.js class App extends React.Component { renderItem = (route, index) => { const { navigation, jumpToIndex, } = this.props; const isCapture = route.routeName === 'Capture'; const focused = index === navigation.state.index; return ( <TouchableWithoutFeedback key={route.key} onPress={() => isCapture ? this.props.navigation.navigate(

问题 My react-native application consists of a DrawerNavigator that contains several StackNavigators. A simplified example of my structure looks like this - Drawer - Stack 1 - Screen 1 - Screen 2 - Stack 2 - Screen 1 - Screen 2 My problem is the following: I am on Screen 1 of Stack 1. I navigate to screen 1 of Stack 2 using the Drawer. From Screen 1 of Stack 2 I navigate to Screen 2 of Stack 2 on the press of a button. I then navigate back to Stack 1 using the Drawer. I again return to Stack 2

问题 This is my actual Code: App.js import React from 'react'; import {StackNavigator} from 'react-navigation'; import DrawerStack from './src/stacks/drawerStack'; const Navigator = StackNavigator({ drawerStack: {screen: DrawerStack} }, { headerMode: 'screen', initialRouteName: 'drawerStack' }) export default Navigator drawerStack.js import React from 'react' import {StackNavigator, DrawerActions} from "react-navigation"; import {Text, View, TouchableOpacity} from 'react-native'; import Home from

问题 I have two StackNavigator. Movies: const MoviesStackNavigator = createStackNavigator({ Movies: Movies, MovieDetails: MovieDetails, },{ initialRouteName: 'Movies', }) and actors: const ActorsStackNavigator = createStackNavigator({ Actors: Actors, ActorDetails: ActorDetails, },{ initialRouteName: 'Actors', }) I am using them inside a TabNavigator: const RootTabs = createBottomTabNavigator({ Movies: { screen: MoviesStackNavigator, navigationOptions: { tabBarLabel: 'Movies' } }, Actors: { screen: