reactjs - 使用钩子(Hook)多次渲染 react 功能组件

Question

这个问题在这里已经有了答案:





Does React batch state update functions when using hooks?

(5 个回答)


2年前关闭。




其实我没有得到这个问题的正确观点。于是寻求帮助。
我有这个状态的全功能组件。
我在这里注意到的是，当我使用 useEffect 钩子(Hook)获取数据时，我得到了正确的响应。

问题是，当我在 return 语句中执行 console.log("ok") 时，它会在控制台中多次提供输出。图像添加如下:

这是我的状态和 useEffect 钩子(Hook)



这是我的返回函数



这是我每次浏览页面时得到的控制台输出。


为什么 console.log("ok") 执行多次？

Answer 1

它没有执行 multiple次，它正在执行 5 次:

useEffect (第一次渲染)

setMovies

setHeroImage

setCusrrentPage

setTotalPages

useEffect具有 [] 的部门所以这只发生在第一次渲染上。然后您将更改状态 4 次，因此会发生重新渲染。这并不意味着 DOM 改变了 5 次。