2

如果其中一个更新，是否可以重新渲染组件的一个或两个子级？我有一个看起来像这样的组件：

const ContributeBody = () => (
  <StyledContributeBody>
    <LastThreePages />
    <ContributeForm />
  </StyledContributeBody>
);

该ContributeForm组件收集数据并调用将数据添加到我的 Fauna DB 集合的 API 函数。

该LastThreePages组件调用一个 API 函数，该函数从 Fauna DB 集合中获取最后三页。

目前，需要硬重新加载页面才能更新LastThreePages。

我正在寻找一种在将数据提交到 Fauna DB CollectionLastThreePages后重新加载的方法。ContributeForm

目前，我没有使用 Redux 或 GraphQL。我正在使用 FQL。

通量模式是这里的答案吗？

4

2 回答 2

0

据我所知，当组件的状态或属性发生变化时，它会重新渲染组件。我想传递一些虚拟属性会起作用（我没有对此进行测试）：

const ContributeBody = () => (
  const [rev, setRev] = useState((new Date()).valueOf());

  <StyledContributeBody>
    <LastThreePages rev={rev} />
    <ContributeForm onSuccess={() => {setRev((new Date()).valueOf());}} />
  </StyledContributeBody>
);

onSuccess需要重新渲染时调用

于 2020-01-14T23:33:02.257 回答
0

我的建议是StyledContributeBody（或更高级别）管理数据读取和提交，然后通过 React Context（推荐）或 Redux 或将数据作为 props 传递，将数据传递给子组件。

当数据被读取和更改时，您可以触发其他数据的刷新，这将向下渗透到子组件。

于 2020-01-15T04:26:55.323 回答