自定义钩子不更新组件答案

【问题标题】：custom hook not updating components自定义钩子不更新组件
【发布时间】：2021-08-11 17:38:21
【问题描述】：

我编写了一个简单的自定义挂钩来控制倒数计时器。在其中，我有一个剩余秒数的状态变量。在单击按钮时会触发此变量的减法，并且应该每秒减去 1000 毫秒的间隔。 Display组件负责显示更改后的seconds变量

函数被适当地触发，也就是减法在内部工作，但是，以秒为单位的变化不会传播到所有组件，显示组件也不会改变。见CodeSandBox。

我的印象是状态（秒）的变化也应该重新呈现其依赖的收件人，因为那里使用了 seconds 变量。

如何让 Display 组件跟踪值的变化？

【问题讨论】：

【解决方案1】：

您的自定义钩子的范围仅限于它所调用的组件。任何useState 调用都会在本地存储信息，并且根本不会共享。

您必须使用 Context API 将这个状态提升到树上，然后您可以使用 useContext 钩子在较低的组件中访问它。见：https://reactjs.org/docs/hooks-reference.html#usecontext

【讨论】：