How can I go back on Stack Navigation in React Navigation?-CodePudding

I created a navigation called UpdatePlace in createStackNavigator

By default, when the headerback icon is clicked, navigation goes back to the previous component.

However, when I press the button after applying my own custom HeaderLeft icon with headerLeft, it does not go back. What should I do at this time?

this is my code

const RootStack = createStackNavigator();

        <RootStack.Navigator screenOptions={{ headerShown: false }}>
        <RootStack.Screen name="UpdatePlace" component={UpdatePlace}
                options={{
                    headerShown: true,
                    headerTitle: "Hello",
                    headerTitleAlign: 'center',

                    headerLeft: () => (
                        <Pressable style={{ width: '100%', height: '80%' }}>
                            <Image source={cusImage.Arrow} style={{ width: '40%', height: '70%', resizeMode: 'contain' }}

                            />
                        </Pressable>
                    ),
                }}
            />
        </RootStack.Navigator>

CodePudding user response：

You also need to add the click action to your custom element

headerLeft: ({ navigation }) => (
  <Pressable onPress={() => navigation.goBack()} style={{ width: '100%', height: '80%' }}>
      <Image source={cusImage.Arrow} style={{ width: '40%', height: '70%', resizeMode: 'contain' }} />
  </Pressable>
)