Как сбросить ссылку при изменении зависимостей - PullRequest
Новая
       7

Как сбросить ссылку при изменении зависимостей

0 голосов
/ 02 мая 2019

Я пишу ловушку, которая использует useRef, и я хотел бы сбросить ref к его начальному значению, когда значения deps, переданные ловушке, изменяются (аналогично тому, как ведет себя useState). К сожалению, нет параметра "deps" для useRef.

Чтобы получить лучшее представление о том, чего я пытаюсь достичь, я прикрепил пользовательский крючок. Я хочу инициировать обратный вызов, когда была введена определенная последовательность клавиш (то есть код конами). Я хочу сбросить refIndex на 0 при изменении code, handler или deps. Использование useState не вариант, потому что он будет вызывать повторный рендеринг каждый раз, когда устанавливается состояние. 

function useKeySequence(code, handler, deps) {
  const refIndex = useRef(0);

  const onKeyUpCallback = useCallback((e) => {
    const onKeyUp = ({ key }) => {
      if (refIndex.current === codes.length - 1) {
        handler();
      }

      if (
        key != null &&
        codes[refIndex.current] != null &&
        key.toLowerCase() === codes[refIndex.current].toLowerCase()
      ) {
        refIndex.current++;
      } else {
        refIndex.current = 0;
      }
    };

    onKeyUp(e);
  }, [codes, handler, ...deps]);

  // Add event listeners
  useEffect(() => {
    window.addEventListener("keyup", onKeyUpCallback);
    return () => {
      window.removeEventListener("keyup", onKeyUpCallback);
    };
  }, [onKeyUpCallback]);
}
...