时间戳

首页 > 解决方案 > 调用异步 Hook 会触发多个请求吗？

reactjs - 调用异步 Hook 会触发多个请求吗？

问题描述

想象以下组件：

function useAsyncHook() {
  async function doAsyncStuff() {
    ...
  }

  doAsyncStuff();
}

function Foo() {
  const result = useAsyncHook();

  return (
    <>
      ...
    </>
  );
}

function App() {
  const result = useAsyncHook();

  return (
    <>
      <Foo/>
      ...
    </>
  );
}

请注意，App包括Foo在其嵌套组件中。对不起，如果这是一个愚蠢的问题，但是有多少网络请求？只有一个，隐式缓存，还是两个，每个组件一个？

标签： reactjsasync-awaitreact-hooks

解决方案

您将有两个网络请求，自定义挂钩不共享状态。

从文档

使用相同 Hook 的两个组件是否共享状态？不会。自定义 Hook 是一种重用有状态逻辑的机制（例如设置订阅和记住当前值），但是每次使用自定义 Hook 时，其中的所有状态和效果都是完全隔离的。

推荐阅读