小编Joe*_*fei的帖子

我有一个或多或少结构如下的表单页面：

<Layout>
  <Page>
    <Content>
      <Input />
      <Map />
    </Content>
  </Page>
  <Button />
</Layout>

Map 组件应该只渲染一次，因为在渲染时会触发一个动画。这意味着内容、页面和布局根本不应该重新渲染。

当输入为空时，应禁用布局内的按钮。Input 的值不受 Content 控制，因为状态更改会导致重新渲染 Map。

我尝试了一些不同的东西（使用 refs、useImperativeHandle 等），但没有一个解决方案让我感觉很干净。在不更改布局、页面或内容状态的情况下，将输入状态连接到按钮状态的最佳方法是什么？请记住，这是一个相当小的项目，代码库使用“现代”React 实践（例如钩子），并且没有像 Redux、MobX 等那样的全局状态管理。