react useRef解决异步闭包问题,因为ref对象在组件的整个生命周期内保持不变

最新推荐文章于 2024-07-23 15:26:38 发布

qq_21138747

最新推荐文章于 2024-07-23 15:26:38 发布

阅读量733

点赞数

本文链接：https://blog.csdn.net/qq_21138747/article/details/111465110

版权

export const MyComponent = props=>{
 const [message,setMessage] = useState('inittial message')
 const [seconds,setSeconds] = useState(0)
const secondsRef = useRef(seconds)

useEffect(()=>{
 setTimeout(()=>{
  setSeconds(1)
  secondsRef.current = 1;
 },1000);
 setTimeout(()=>{
 setMessage(`Total Seconds  ${secondsRef.current}`)
 },2000);
},[])
//这里不需要传依赖就能2秒后再次改变值
return (
 <>
   <h3>{message}</h3>
   <h4>{seconds}</h4>
 </>
)
}