Блог

Главная - Вопросы по программированию - BackHandler.removeEventListener не работает в useEffect

BackHandler.removeEventListener не работает в useEffect

#reactjs #react-native #react-hooks

#reactjs #react-native #реагирующие хуки

Вопрос:

Я хочу быть активным BackHandler на одном экране, основываясь на следующем коде

 useEffect(() => {
    BackHandler.addEventListener('hardwareBackPress', handler)

    return () => {
        console.log('Clean up ....')// this line does not fire
        BackHandler.removeEventListener('hardwareBackPress', handler)
    }
}, [handler])

const handler = () => {
    Alert.alert("Hold on!", "Are you sure you want to exit?", [
        {
            text: "Cancel",
            onPress: () => null,
            style: "cancel"
        },
        { text: "YES", onPress: () => BackHandler.exitApp() }
    ]);
    return true;
}

Комментарии:

1. Почему вы передали handler функцию в массив зависимостей?

2. когда я удаляю обработчик в массиве зависимостей, это не влияет

Ответ №1:

  useEffect(() => {
    const unsubscribe = BackHandler.addEventListener('hardwareBackPress', handler);
  return unsubscribe;
  }, []);

Ответ №2:

на основе https://reactnative.dev/docs/backhandler этот я использую

 useEffect(() => {
  const backHandler = BackHandler.addEventListener("hardwareBackPress", handler);

  return () => backHandler.remove();
}, []);