应用场景:
等待react组件内的state发生变更后进行后续操作。
已知问题
通常state的变化会引起dom的刷新,更新state一般使用setState,但这是个异步操作。
如果此时需要立即操作dom,得到的目标dom是刷新之前的样子。
应对方法
方法1:使用useEffect监听state,当监听的state发生变化时会触发回调,此时的dom也刷新完毕。
举例:
const [count,setCount]=useState(0)
useEffect(()=>{
//这里是state的监听回调
},[count])
方法2:
使用timeout,调用setState后,后续操作放在timeout中处理。
举例:
const [count,setCount]=useState(0)
function handleChange(val:number){setCount(val)setTimeout(()=>{//后续操作放在这})
}