const [count,setCount]=useState(5)
useEffect(()=>{
setCount(10)},[count])
在上面的代码中，如果我在没有异步操作的情况下更新状态，useEffect 不会进入无限循环。而在下面的代码中，如果我通过 asysnc 操作更新状态，它会进入无限循环，有人可以告诉我 useEffect 在异步操作的情况？
const [count,setCount]=useState(5)
useEffect(()=>{
//some async operation
.then(response)=>{
setCount(response.data)}},[count])
【问题讨论】：
response.data 是否为数字。并检查每次获取响应时是否没有返回新值。
标签： reactjs react-redux react-hooks use-effect
这是因为数字是通过引用与值和对象进行比较的。每次异步操作都会产生新的对象引用，因此会触发useEffect。
如果像setCount(5) 这样的数字不会再次触发，因为第二次5 与之前的变量相同。
【讨论】：
这是个好问题！
在第一个 sn-p 中，您将计数设置为 10，该值不会动态更改，因此它将更改一次并等待计数再次更改，这不会在那里发生，而在第二个 sn- p 一旦异步操作完成，它将更新count，并且由于此计数更新useEffect 将与其中的异步操作一起再次触发。所以它进入了递归更新。
如果你愿意，你可以像这样改变第一个 sn-p 来查看递归更新
setCount(count + 1);
【讨论】：
这是钩子的捕获以及它们如何更新状态，如果您之前的状态值和当前状态值相同，则反应功能组件不会重新渲染，因此建议您使用对象类型的状态然后在更新状态时始终创建新对象或使用扩展运算符更新对象内部的任何属性。在您的情况下， setCount(10) 将始终返回一个常量值 10，因此 useEffect 不会触发无限次，因为理论上 count 从 5 更改为 10 一次，但对于 API 请求，它将始终返回一个具有新引用的对象，因此它将创建一个无限循环。您也可以在您的 API 结果中执行 setCount(10)，它也不会触发 useEffect，因为 count 基本上不会从 10 更改，除非从更改 5 到 10。
【讨论】：