useEffectで初回取得

React実践 / 全 6 枚

呼ぶ場所で結果が変わる

取得する処理を、どこに書くかで動き方がまったく変わります。

部品の中で直接呼ぶ

function App() {
  loadItems();

  return <div>...</div>;
}

useEffectの中で呼ぶ

function App() {
  useEffect(() => {
    loadItems();
  }, []);

  return <div>...</div>;
}

直接呼ぶと、取得で state が変わるたびにまた呼ばれ、止まらない輪になります。

1 / 6

← → キーでも送れます