使用useState因异步导致数据不能及时更新的问题
使用useState因异步导致数据不能及时更新的问题
·
相信大家在使用hooks的时候都踩过这样的坑,useState因异步导致数据不能及时更新。
const [kwd, setkwd] = useState("")
const changekwd = (res) => {
setkwd(res.kwd)
getNew() //渲染数据方法
}
如上例,当使用setkwd对kwd进行修改,并重新渲染数据时,发现不能够立即获取到更新后的数据,出现的效果就是:触发两次该方法才成功渲染页面数据。
这很明显是useState的异步所导致的。
解决方案:
使用useEffect对useState的数据进行监听,监听到变化(数据变新)后再使用与渲染该数据。
const [kwd, setkwd] = useState("")
const changekwd = (res) => {
setkwd(res.kwd)
}
useEffect(()=>{
getNew() //这里会获取到变化后的数据
},[kwd])
希望本文会对你有所帮助^_^
更多推荐
已为社区贡献6条内容
所有评论(0)