多次渲染带有钩子的react功能组件

实际上,我没有正确理解这个问题。因此寻求帮助。 我有这个状态的完整功能组件。 我在这里注意到的是,当我使用useEffect挂钩获取数据时,我会正确地获得响应。

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

这是我的状态和useEffect钩子

多次渲染带有钩子的react功能组件

这是我的返回函数

多次渲染带有钩子的react功能组件

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

多次渲染带有钩子的react功能组件

为什么console.log(“ ok”)执行多次?

boh333 回答:多次渲染带有钩子的react功能组件

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

  1. useEffect(第一个渲染)
  2. setMovies
  3. setHeroImage
  4. setCusrrentPage
  5. setTotalPages

useEffect的deps为[],因此这仅发生在第一个渲染中。然后您将状态更改4次,因此发生了重新渲染。这并不意味着DOM被更改了5次。

,

由于useState重新呈现了组件,因此您应该阅读React文档以了解

,

React非常简单,并且基本上始终重新渲染所有内容。如果组件的状态已更改,则会触发重新渲染。您更新状态4次,这就是原因。

本文链接:https://www.f2er.com/3165390.html

大家都在问