栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

useState设置方法不能立即反映更改

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

useState设置方法不能立即反映更改

类似于通过扩展

React.Component
或创建的Class组件中的setState,
React.PureComponent
使用
useState
钩子提供的更新程序的状态更新也是异步的,不会立即反映出来

同样,这里的主要问题不仅是异步性质,而且函数根据状态的当前闭包和状态更新来使用状态值这一事实将反映在下一次重新渲染中,现有闭包不会受到影响,而是会创建新的闭包
。现在,在当前状态下,挂钩中的值由现有的闭包获取,并且当重新渲染时,将根据是否再次创建函数来更新闭包。

即使添加了一个

setTimeout
函数,尽管超时将在发生重新渲染的一段时间后运行,但是setTimout仍将使用其先前关闭而不是更新后的值。

setMovies(result);console.log(movies) // movies here will not be updated

如果要对状态更新执行操作,则需要使用useEffect钩子,就像

componentDidUpdate
在类组件中使用一样,因为useState返回的setter没有回调模式

useEffect(() => {    // action on update of movies}, [movies]);

就更新状态的语法而言,

setMovies(result)
将状态中的先前
movies
值替换为异步请求中可用的值

但是,如果要将响应与先前存在的值合并,则必须使用状态更新的回调语法以及正确使用的扩展语法,例如

setMovies(prevMovies => ([...prevMovies, ...result]));


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/418964.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号