doubleyong
管理员
管理员
  • 最后登录2020-12-03
  • 发帖数938
  • 最爱沙发
  • 喜欢达人
  • 原创写手
  • 社区居民
  • 忠实会员
阅读:114回复:0

[react]React中setState方法异步问题

楼主#
更多 发布于:2020-11-10 16:43
问题描述
在项目中使用state存储本组件的状态 , 使用setState对组件进行状态更新 , setState更新数据会重新渲染页面



问题:state的值改变了,但是页面没有渲染出来

代码如下:

constructor(){
        super()
        this.state={
            userData:[]
        }
    }
this.setState(
   userData:this.getUserData()
)

 
原来,setState方法是异步的,在state状态改变还没有执行完时,使用state的值,还是改变前的值


解决方案

方法一:使用setState的回调函数,此回调函数会在状态改变后,进行调用 。将要使用state的代码写入回调函数即可

this.setState(userData:this.getUserData(),()=>{
      //
      // 
})


 

方法二:使用async 与await结合使用

async getUserData(){
       await this.setState({
           userData:this.getUserData()
       });
}
知识需要管理,知识需要分享
游客


返回顶部

公众号

公众号