reactjs - 我正确使用 React Hook？

Question

我想为无限滚动应用 React 钩子。所以，我最终得到了这段代码：

export default function index() {
  const [allTracks, setAllTracks] = useState([]);
  const [offset, setOffset] = useState("");

  const { tracks, error, loading, lastVisible } = useFetchPublicTracks(
    myApiEndPoint.TRENDING_TRACKS,
    5,
    offset
  );

  //concat tracks when got data successfully
  useEffect(() => {
    if (!loading && tracks) setAllTracks([...allTracks, ...tracks]);
  }, [loading, tracks]);

  console.log("tracks", allTracks);
  console.log("lastVisible", lastVisible);
  console.log("loading", loading);

  return (
    <div>
      <button className="" onClick={() => setOffset(lastVisible)}>
        Load More
      </button>
      <Main></Main>
    </div>
  );
}

当我单击“加载更多”按钮时，将设置新的偏移量。之后，组件再次重​​新渲染并使用新的偏移量调用 Api。

我想问一下我是否正确使用了 React 钩子？有没有更好的办法？另外，我需要在我的用例中使用useCallback/useMemo吗？

标签： reactjsapireact-hooks