在 if 语句中调用 useState hook 的 setter 是否意味着 BREAKING RULES OF HOOKS？

Question

React 文档声明： 不要在循环、条件或嵌套函数中调用 Hook。

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

在条件中调用 setter 怎么样？

这段代码是否违反了钩子规则？

const [oneHook, setOneHook] = useState(0)
const [anotherHook, setAnotherHook] = useState(false)

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

谢谢 ！

Answer 1

不，该代码示例并没有违反钩子规则。每次组件渲染时，都会以完全相同的顺序调用完全相同数量的 useState ，所以这没问题。

我确实想指出，立即在组件主体中设置状态没有多大意义。当组件安装时，它将开始使用状态中的初始值进行渲染，但在完成渲染之前，状态已经发生变化，并且必须重新开始。但想必这只是示例的一个工件，在您的实际代码中，它将if位于 useEffect 或其他一些实际代码位置中。