Question

我在React Navigation v3中使用createBottomTabNavigator，我有3条这样的路线：

const Route = createBottomTabNavigator(
  {
    Home: {
      screen: HomeRoute
    }
    Post: {
      screen: PostRoute
    },
    Mark: {
      screen: MarkRoute
    },
  }
)

但是当我想从选项卡的“标记”导航到“帖子”而不是导航和更改选项卡的问题时，问题或更好的说法是出现错误：（

任何机构都能解决这个问题？谢谢！

Answer 1

要进行导航，请使用所使用按钮的道具的 navigate（）功能。例如，如果我们将 createBottomTabNavigator 定义为

export default createBottomTabNavigator(
  {
    Home: HomeScreen,
    Settings: SettingsScreen,
  }
);

我们将使用按钮的导航功能转到设置标签，如下所示，

class HomeScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Home!</Text>
        <Button
          title="Go to Settings"
          onPress={() => this.props.navigation.navigate('Settings')}
        />
      </View>
    );
  }
}

这里有更详细的示例，TAB-BASED-NAVIGATION

Answer 2

这样定义您的路线

const Route = createBottomTabNavigator(
    {
        Home: HomeRoute,
            Post: PostRoute,
            Mark: MarkRoute,
    },
    {
        defaultNavigationOptions: ({ navigation }) => ({
            tabBarIcon: ({ focused, horizontal, tintColor }) => {
                const { routeName } = navigation.state;
                return <View/>
            },
        }),
        tabBarOptions: {
            activeTintColor: 'red',
            inactiveTintColor: 'gray'
            style: {
                backgroundColor: 'black'
            },
            labelStyle: {
                fontSize: 12
            },
        },
    }
);

createBottomTabNavigator无法将选项卡从路线3更改为路线2

2 个答案: