Реагируйте: useState или useRef? - PullRequest
Новая
       3

Реагируйте: useState или useRef?

5 голосов
/ 05 июня 2019

Я читаю о React useState() и useRef() в " Hooks FAQ ", и я запутался в некоторых случаях использования, которые, кажется, имеют решение одновременно с useRef и useState,и я не уверен, что это правильный путь.

Из "FAQ по крючкам" об useRef () :

"useRef ()Хук не только для ссылок DOM. Объект «ref» - ​​это универсальный контейнер, текущее свойство которого является изменяемым и может содержать любое значение, подобное свойству экземпляра класса. "

С useRef () : 

function Timer() {
  const intervalRef = useRef();

  useEffect(() => {
    const id = setInterval(() => {
      // ...
    });
    intervalRef.current = id;
    return () => {
      clearInterval(intervalRef.current);
    };
  });

  // ...
}

с useState () : 

function Timer() {
  const [intervalId, setIntervalId] = useState(null);

  useEffect(() => {
    const id = setInterval(() => {
      // ...
    });
    setIntervalId(id);
    return () => {
      clearInterval(intervalId);
    };
  });

  // ...
}

Оба примера будут иметь одинаковый результат, но какой этолучше - а почему?

1 Ответ

5 голосов
/ 05 июня 2019

Основное различие между ними:

useState вызывает повторный рендеринг, useRef - нет.

Общее между ними: useState и useRefможете вспомнить свои данные после повторного рендеринга.Так что, если ваша переменная является чем-то, что определяет рендеринг слоя представления, перейдите с useState.Иначе используйте useRef

Я бы предложил прочитать эту статью .

...