setCounter执行后counter的值
来源：4-1 什么是Hooks
Tirsky1683388
2020-08-24
import { useState, useEffect } from "react"
const MyCounter = () => {
const [counter, setCounter] = useState(0)
useEffect(() => {
const interval = setInterval(() => {
setCounter(c => c + 1)
console.log(counter)
}, 1000)
return () => clearInterval(interval)
}, [])
console.log(counter)
return <span>{counter}</span>
}
export default MyCounter
客户端控制台打印的结果如下
0
1
0
2
0
3
0
想问下为什么在useEffect中打印出的counter值和在组件中打印出的counter值不一样？ 谢谢老师
写回答
1回答
-
Tirsky1683388
提问者
2020-08-24
在下一节课中找到答案了 因为setInterval中的counter是其执行的一瞬间counter的值，之后也一直是0 所以打印出来0，而setInterval外部的counter真实的随时间改变的值
012020-08-29
全栈进阶课程 React16.8+Next.js+Koa2一步到位开发Github
学习React/Next.js服务端渲染SSR同构设计方案，理解OAuth登录体系的实现原理
651 学习 · 311 问题
相似问题