资讯专栏INFORMATION COLUMN

关于this.setState更新的问题

darkbug / 3010人阅读

摘要:是异步,所以在之后立即调用是获取不到最新的数据的,那么怎么获取最新的数据呢下面介绍三个方法回调函数在之后去函数中调用,此时的已经更新将放入函数中在函数中,在之后是立即更新的,所以也可以获取到更新后的数据。

this.setState是异步,所以在this.setState之后立即调用this.state是获取不到最新的数据的,那么怎么获取最新的数据呢?下面介绍三个方法:

1.回调函数callback

this.setState({
  val: this.state.val+1
}, () => {
  console.log(this.state.val)
});

2.componentDidUpdate

componentDidUpdate(){
    console.log(this.state.val);
}

在this.setState之后去componentDidUpdate函数中调用,此时的this.state已经更新

3.将this.setState放入setTimeout函数中

let self = this;
setTimeout(function () {
  self.setState({
    val:self.state.val+1
  });
  console.log(self.state.val);
})

在setTimeout函数中,在this.setState之后this.state是立即更新的,所以也可以获取到更新后的数据。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/82934.html

相关文章

  • 关于this.setState( )中数据延迟问题

    摘要:判断当前是否处于批量更新状态,如果是,将当前组件加入待更新的组件队列中。将组件的暂存队列中的进行合并,获得最终要更新的对象,并将队列置为空。执行生命周期,根据返回值判断是否要继续更新。 this.setState( )方法是React.js中最常见的一种方法,利用它可以控制各种状态变化,达到页面各种交互效果,但是,我们在React开发中偶尔会发现,明明已经通过this.setState...

    Lorry_Lu 评论0 收藏0
  • 一个关于React.Component.setState问题

    摘要:不保证这个状态的更新是立即执行的。这个问题导致如果开发者在之后立即去访问可能访问的不是最新的状态。不应该被直接更改,而是应该新建一个来表示更新后的状态。实验采用基于控制变量法的对照试验。至于的问题,留给读者自己吧。 React组件重新渲染的条件是: B.只要调用this.setState()就会发生重新渲染。 C.必须调用this.setState()且传递不同于当前this.setS...

    BoYang 评论0 收藏0
  • setState promise 化探讨 体会 React 团队设计思想

    摘要:我们来从设计思想上,和官方团队的回应上,了解一下否决理由。此外,还有一个方法新的接口设计支持接收一个回调函数,当其子组件挂载时,这个回调函数就会相应触发。 从 setState 那个众所周知的小秘密说起... 在 React 组件中,调用 this.setState() 是最基本的场景。这个方法描述了 state 的变化、触发了组件 re-rendering。但是,也许看似平常的 th...

    caiyongji 评论0 收藏0
  • setState promise 化探讨 体会 React 团队设计思想

    摘要:我们来从设计思想上,和官方团队的回应上,了解一下否决理由。此外,还有一个方法新的接口设计支持接收一个回调函数,当其子组件挂载时,这个回调函数就会相应触发。 从 setState 那个众所周知的小秘密说起... 在 React 组件中,调用 this.setState() 是最基本的场景。这个方法描述了 state 的变化、触发了组件 re-rendering。但是,也许看似平常的 th...

    forrest23 评论0 收藏0
  • setState异步、同步与进阶

    摘要:根本原因在于,并不是真正意义上的异步操作,它只是模拟了异步的行为。而合成事件和生命周期函数中,是受控制的,其会将设置为,从而走的是类似异步的那一套。总结此处总结是直接引用了只在合成事件和钩子函数中是异步的,在原生事件和中都是同步的。 如何使用setState 在 React 日常的使用中,一个很重要的点就是,不要直接去修改 state。例如:this.state.count = 1是无...

    widuu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<