Есть ли способ предотвратить выход с экрана в React Native ?

Я поискал в Интернете и не смог найти способ.

Ответ

 function EditText({ navigation }) {
  const [text, setText] = React.useState('');
  const hasUnsavedChanges = Boolean(text);

  React.useEffect(
    () =>
      navigation.addListener('beforeRemove', (e) => {
        if (!hasUnsavedChanges) {
          // If we don't have unsaved changes, then we don't need to do anything
          return;
        }

        // Prevent default behavior of leaving the screen
        e.preventDefault();

        // Prompt the user before leaving the screen
        Alert.alert(
          'Discard changes?',
          'You have unsaved changes. Are you sure to discard them and leave the screen?',
          [
            { text: "Don't leave", style: 'cancel', onPress: () => {} },
            {
              text: 'Discard',
              style: 'destructive',
              // If the user confirmed, then we dispatch the action we blocked earlier
              // This will continue the action that had triggered the removal of the screen
              onPress: () => navigation.dispatch(e.data.action),
            },
          ]
        );
      }),
    [navigation, hasUnsavedChanges]
  );

  return (
    <TextInput
      value={text}
      placeholder="Type something…"
      onChangeText={setText}
    />
  );
}
 

для получения дополнительной информации обратитесь: https://reactnavigation.org/docs/preventing-going-back/

Это предотвратит переход пользователя с одного экрана на другой. Но это не мешает навигации по вкладкам, потому что экран не удаляется.

запретить навигацию по вкладкам

 <Tab.Screen
                    name={'search'}
                    component={SearchNavigator}
                    options={{
                      tabBarIcon: ({ focused, color }) => (
                        <View>
                          <Icon
                            name='search1'
                            color={
                              focused
                                ? 'black'
                                : 'white'
                            }
                            size={25}
                          />
                        </View>
                      ),
                    }}
                    listeners={{
                      tabPress: (e) => {
                        if (true) {
                          // Prevent default action
                          e.preventDefault()
                          // Prompt the user before leaving the screen
                          Alert.alert(
                            'Discard changes?',
                            'You have unsaved changes. Are you sure to discard them and leave the screen?',
                            [
                              {
                                text: "Don't leave",
                                style: 'cancel',
                                onPress: () => {},
                              },
                              {
                                text: 'Discard',
                                style: 'destructive',
                                // If the user confirmed, then we dispatch the action we blocked earlier
                                // This will continue the action that had triggered the removal of the screen
                                onPress: () =>
                                  navigationRef.current?.navigate(
                                    'search',
                                    {}
                                  ),
                              },
                            ]
                          )
                        }
                      },
                    }}
                  />
 

Вы можете добавить прослушиватель tabPress , как описано выше, и выдать предупреждение.