当指定自定义headerLeft时,在标题中渲染默认后退按钮
问题描述:
在反应本机项目中使用react-navigation时,是否可以在指定自定义headerLeft时在堆栈导航器内呈现默认后退按钮?或者,这是唯一可能的显式返回一个自定义headerLeft也包含一个按钮,执行navigation.goBack
按?我目前的代码如下所示,但我也希望在适用时显示后退按钮(当goBack是一个选项时)。当指定自定义headerLeft时,在标题中渲染默认后退按钮
export default StackNavigator(
{
...,
},
{
headerMode: "float",
navigationOptions: ({ navigation }) => ({
headerLeft: (
<MaterialCommunityIcons name={"menu"} style={{ color: "white" }} size={25} onPress={() => navigation.navigate("DrawerOpen")} />
),
headerStyle: { backgroundColor: "#4C3E54", paddingLeft: 10, paddingRight: 10 },
headerTitleStyle: { color: "white" }
})
}
)
供参考的图像显示返回按钮,然后在应用自定义headerLeft后的标题。
答
您可以设置navigationOption
为每个屏幕不同,你也可以设置默认为navigationOption
整个StackNavigation
。在下面的示例中,除Main
屏幕以外的每个屏幕都将禁用手势。
例
const ModalNavigator = StackNavigator(
{
Main: {
screen: Main,
navigationOptions: {
gesturesEnabled: true,
}
},
Login: { screen: Login },
Profile: { screen: Profile },
},
{
headerMode: 'none',
mode: 'modal',
navigationOptions: {
gesturesEnabled: false,
}
}
);