如何在反应导航中更改后退按钮路线

Question

我正在使用反应导航（堆栈导航）。我想更改我的标题后退按钮图标路线。

1. 家
2. 订票

3. 我的预订

   这些是我在项目中的屏幕。现在，当我单击 MyBookings 屏幕中的标题后退按钮时，它应该路由到主屏幕。

Answer 1

如果您的 stackNavigator 堆栈配置正确，则默认情况下必须有后退按钮。

但是，如果您想替换默认按钮，只需添加headerLeft并在要更改后退按钮处理程序的页面中传递您的自定义组件屏幕导航选项

CreateAccountScreen.navigationOptions = ({navigation}) => ({
  headerStyle: styles.headerStyle,
  title: 'Create Account',
  headerTintColor: '#fefefe',
  headerTitleStyle: styles.headerTitleStyle,
  headerLeft: {()=>(
          <Icon name="chevron-left"
                onPress={() => navigation.goBack(null)}
                size={35} color="white"/>
       )}
});