reacthooksuseState更新数据不及时问题及处理
数据更新有延时不能及时获取：
const [state, setState] = useState({
num: 0
});
// 直接更新数据
const doing = () => {
setState({
num: 1
})
console.log(state); // { num: 0 } 数据未更新
}
// 使⽤函数返回更新数据
const doing = () => {
setState(() => {
...
return { num: 1 }
})
console.log(state); // { num: 0 } 数据未更新
}
// 使⽤async/await异步等待获取
const doing = async () => {
await setState(() => {
...
return { num: 1 }
})
console.log(state); // { num: 0 } 数据未更新
}
doing()
  调试发现直接更新数据、使⽤函数返回更新数据、使⽤async/await异步等待获取数据都不能及时更新
reacthooks理解
解决⽅案：
const [state, setState] = useState({
num: 0
});
// 直接更新数据
const doing = () => {
setState({
num: 1
})
console.log(state); // { num: 0 } 数据未更新
}
doing()
useEffect(() => {
console.log(state); // { num: 1 } 数据已更新
}, [state])
  Effect Hook可以让你在函数组件中执⾏副作⽤操作，给useEffect钩⼦传递第⼆参数[state]侦听数据变化执⾏钩⼦函数，在useEffect内能获取到更新完的数据

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。