使用带有 React Native 的标签导航器的页面标题标题的最佳方法是什么?我知道有一种方法可以将 TabNavigator 包装在 StackNavigator 中,但我不明白如何使用不同类中的不同组件来执行此操作...
What is the best way to have a header with the page title with a tab navigator with react native? I know there is a way to wrap you TabNavigator inside of StackNavigator, but I do not understand how to do this with different components in different classes...
这是我正在做的设置 TabNavigator:
This is what I am doing to set up the TabNavigator:
App.js 内部:
export default createBottomTabNavigator( { Activity: Activity, Front: Front }, { navigationOptions: ({ navigation }) => ({ tabBarIcon: ({ focused, horizontal, tintColor }) => { const { routeName } = navigation.state; let iconName; if (routeName === 'Activity') { iconName = `ios-information-circle${focused ? '' : '-outline'}`; } else if (routeName === 'Front') { iconName = `ios-cog`; } return <Ionicons name={iconName} size={horizontal ? 20 : 25} color={tintColor} />; }, }), tabBarOptions: { activeTintColor: 'tomato', inactiveTintColor: 'gray', }, }); 推荐答案每个tab都可以是一个StackNavigator,例如:
Each tab can be a StackNavigator, for example:
const activityStackNavigator = createStackNavigator({ Activity: { screen: Activity, navigationOption: { headerTitle: 'Some title...' } } })然后在您的 TabNavigator 中使用您刚刚创建的 StackNavigator 作为屏幕:
And then in your TabNavigator just use the StackNavigator you just created as a screen:
export default createBottomTabNavigator( { Activity: activityStackNavigator, Front: Front }, ... }这里有一些 阅读 来自 React-Navigation 文档.
Here's some read from the React-Navigation docs.
更多推荐
带有 TabNavigation 反应导航的标题
发布评论