Реагировать на использованиеЭффект очистки только при отключении

Question

Я хотел бы вызвать предупреждение о демонтаже компонента следующим образом:

const [checked, setChecked] = useState(false);

useEffect(() => {
    return () => {
        if(checked) alert("Hi")
    };
}, []);

...

Однако эффект обновляет состояние checked при его изменении. Однако это можно исправить при изменении зависимостей с [] на [checked]. Это, однако, вызывает предупреждение при каждом рендеринге, а не при отключении. Но я хочу вызвать это только на спешке. Как это можно сделать с помощью реакционных крючков?

Answer 1

Вы можете сохранить последнее значение зарегистрированного в ссылке, а затем получить к нему доступ из useEffect.

  const [checked, setChecked] = useState(false);
  const checkedRef = useRef(checked);

  useEffect(() => {
    checkedRef.current = checked;
  }, [checked]);

  useEffect(() => {
    return () => {
      if (checkedRef.current) alert("Hi");
    };
  }, []);

Поскольку ссылки не вызывают обновления, второй useEffect будет запущен только один раз, но первый useEffect будет проверять наличие последнего значения в свойствах selectedRef.current.