当依赖项发生变化,更新total值,打印的问题
来源:3-6 useEffect语法讲解(模拟生命周期以及自定义Hook)

皮小西
2023-06-12
const [count, setCount] = useState(0)
const [total, setTotal] = useState(0)
useEffect(() => {
console.log(count, 111111) // 打印两次 0
setCount(count + 1)
}, [])
useEffect(() => {
console.log(total, 22222) // 打印三次 0
setTotal(count * 5)
}, [count])
return (
<div className='App'>
<p>欢迎学习React后台课程</p>
<p>
Count:{count}, Total:{total}
</p>
</div>
)
老师您好,我想请问一下,就是明明页面中total为5,但是为什么打印出的结果却是三次 0 呢?并且count也已经变成1了,但是还是打印了两次0呢?
写回答
1回答
-
河畔一角
2023-06-13
1. 需要先把main.js里面的严格模式关闭。关闭以后count就会打印一次,total打印两次。
2. count初始化打印一次为0,total打印一次为0 当count更改后,total会再次执行,但是total放在前面,此时total*count还没有计算完成,因此也打印0
00
相似问题