我需要帮助来了解何时在 React 中使用useMemo
钩子与useState
+useEffect
.根据我在阅读S.O.和网站上的其他问题后所理解的:
- 使用
useState
,您可以创建一个值(可通过setter更改(,并且如果依赖项数组中列出的某些依赖项发生更改,您可以使用useEffect
执行任何您需要的操作。例如,在第一次渲染时,您的组件将使用传递给useState
的初始值进行渲染,然后效果将运行,并且您的组件将使用您在效果中使用setter设置的新值重新渲染。
使用 - 将从您提供给钩子的函数计算出来,如果依赖项数组中的某些依赖项发生变化,该值将发生变化。到目前为止,对我来说,它看起来像
useState
+useEffect
,除了你没有设置器来更改值。在渲染时,如果其中一个依赖项已更改,您的 useMemo 将运行。这里的区别:您的组件将在渲染之前等待计算值(不确定这部分(。
useMemo
您可以创建一个值,该值从我所读到的内容来看,useMemo
应该用于重型操作。但是,如果它阻止了组件的渲染,那又有什么意义呢?
有人说使用依赖数组可以避免不必要的更新,但我也可以使用 useEffect 来做到这一点而不会阻止渲染?如果我没有要渲染的繁重组件,使用 useEffect 不是更快吗?
谢谢:)
编辑:我
接受了菲利普费尔德曼的回答,因为它符合我的需求。正如评论中所建议的,您可以查看此问题以进行全局比较:)
你是对的,useEffect
渲染后作为副作用运行。这意味着,当您不想阻塞渲染循环时,可以使用您的版本。
但是,该版本将通过调用setter触发另一个重新渲染。 绘制的初始时间可能会更快,但通过设置新值,您将立即再次阻止渲染循环,在大多数情况下,这应该比直接使用useMemo
慢。