反应useMemo钩子用例

Question

上下文

在阅读了有关钩子的官方文档之后，我想在我的一个项目中尝试使用useMemo。

为了测试它，我设置了一个沙箱项目这里。

该示例在每次输入更改时都使用昂贵的计算(参见"ellapsed ms")。每次运行此昂贵的计算时，计数器都会增加(请参阅“计数器”)。

示例对于回忆录来说是完美的，所以我使用了useMemo钩子，但是结果并不像我预期的那样，这使我相信我从根本上误解了这里的一些东西。

预期：

• 首先呈现慢：值的计算&计数器增量
• Rerenders几乎即时计算，没有反增量

实际：

每次计算都很慢&尽管输入相同，但计数器每次都会增加。

​

​

同样，这里是指向该项目的链接。我的错误在哪里？

Answer 1

每次值更改时都会触发useMemo，因为您将其添加到[value]作为第二个参数。这就是为什么在输入中插入一个新值会导致新的计算。useMemo是用来防止不必要的计算，如果其他东西，但不是价值，改变。但是，由于唯一可以改变的是你的价值，你每次都会看到计算。如果组件具有更多的状态/支持值，则如果其他状态/支持值发生变化，则将跳过计算。希望这能让事情更清楚。编码愉快。