semi-xi / blog

blog
4 stars 1 forks source link

react hook setInterval的问题 #29

Open semi-xi opened 4 years ago

semi-xi commented 4 years ago
const [count, setCount] = useState(0)
useEffect(() => {
setInterval(() => {
    setCount(count++)
}, 1000)
)

因为setInterval不会马上执行,他会进入一个队列里面,等其他的执行完了,就执行这个setInterval,如果渲染的速度很快的话,setInterval会一直被挂起 如果加入了第二个参数的话,又会导致这个setInterval只执行了1次

semi-xi commented 4 years ago

比较好的办法是,setInterval只执行了1次,但是他执行的是一个callback,这个callback的更新又一个动态更新的effect来赋值


useEffect(() => {
callback =  newCallback
})
useEffect(() => {
const timer = setInerval(callback,delay)
return clearInterval(timer)
}
,[])