首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在if语句中调用useState钩子的setter是否意味着违反钩子的规则?

在if语句中调用useState钩子的setter是否意味着违反钩子的规则?
EN

Stack Overflow用户
提问于 2019-11-01 04:06:20
回答 2查看 3K关注 0票数 6

响应docs状态:不调用循环、条件或嵌套函数中的钩子。

调用钩子是否意味着只调用useState,例如const [state, useState] = useState(0)

在条件词中打电话给赛特怎么样?

这是代码破坏了钩子的规则吗?

代码语言:javascript
运行
复制
const [oneHook, setOneHook] = useState(0)
const [anotherHook, setAnotherHook] = useState(false)

if (something) {
   setOneHook(1)
   setAnotherHook(true)
} else {
     setOneHook(0);
     setAnotherHook(false)
}

谢谢!

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-11-01 04:11:32

不,那个代码示例没有破坏钩子的规则。每次组件呈现时,对useState的调用都会以完全相同的顺序进行,这样就可以了。

我想指出的是,在组件的主体中立即设置状态没有多大意义。当组件挂载时,它将使用状态的初始值开始呈现,但在完成呈现之前,状态已经更改,必须重新启动。但据推测,这只是示例中的一个工件,在您的实际代码中,if将位于useEffect或其他一些实用代码位置内。

票数 4
EN

Stack Overflow用户

发布于 2019-11-01 05:12:54

响应docs状态:不要在循环、条件或嵌套函数中调用钩子。

好的,下面的代码显示了上述语句的示例。在需要在循环中设置状态时,我也遇到了同样的问题,如下所示

代码语言:javascript
运行
复制
const [someArray, setArray] = useState([]);

someValue.forEach((value, index) => {
     setArray([...someArray, value]) //this should be avoided
    });

以上我所取得的成就如下

代码语言:javascript
运行
复制
var temp = [];
var counter = 0;
someValue.forEach((value, index) => {
    temp.push(value);
    counter++;
     if (counter === someValue.length) {
          setArray(temp)
       }
    });

如果您要在循环中设置一个状态,而不是每次组件重新呈现,则您不想进入该状态。

是这种破坏钩子规则的代码

不,您的代码看起来很好,因为当组件呈现时,您只根据条件设置状态一次。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58653983

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档