[解決済み] React: useStateとuseRefのどちらを使うか？

質問

私はReactについて読んでいます useState() と useRef() を"で。 フックFAQ で、useRefとuseStateを同時に使って解決しているようなユースケースがあって、どっちが正しいのかわからなくなりました。

Hooks FAQ"より。 useRef()について :

useRef()フックはDOM Refのためだけではありません。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);
    };
  });

  // ...
}

どちらの例も同じ結果になりますが、どちらが良いのでしょうか？

どのように解決するのですか？

両者の大きな違いは、:

useState は再レンダリングを引き起こします。 useRef はしない。

両者に共通しているのは、どちらも useState と useRef は、再レンダリング後もデータを記憶しておくことができます。ですから、もし変数がビューレイヤーのレンダリングを決定するようなものであれば useState . Else use useRef

これを読むことをお勧めします 品物 .