Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

setState的回调函数中再次setState,第二个setState回调函数无法及时获取设置后的值 #161

Open
fjyhub opened this issue May 10, 2020 · 4 comments
Assignees

Comments

@fjyhub
Copy link

fjyhub commented May 10, 2020

问题描述

setState的回调函数中再次setState,第二个setState回调函数中无法及时获取更改后的值

复现步骤

  1. state 中定义两个变量{page: 1, num: 1}
  2. 点击触发更改num值的方法
    3.在setState回调方法中更改page值为2
  3. 此时回调函数中page值仍然为1,没有被改变
    state = {
      num: 1,
      page: 1
    }
    this.setState({num: 1},()=> {
        this.setState({page: 2}, ()=> {
          // 此时page值没被改变,返回结果为1
          console.log(this.state.page)
        })
    })

期望行为

返回正常更改后的值

系统信息

👽 Taro v2.0.4

Taro CLI 2.0.4 environment info:
System:
OS: macOS High Sierra 10.13.6
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.13.0 - /usr/local/bin/node
Yarn: 1.10.1 - /usr/local/bin/yarn
npm: 6.12.0 - /usr/local/bin/npm

@taro-bot
Copy link

taro-bot bot commented May 10, 2020

CC @Littly

@taro-bot
Copy link

taro-bot bot commented May 10, 2020

欢迎提交 Issue~

如果你提交的是 bug 报告,请务必遵循 Issue 模板的规范,尽量用简洁的语言描述你的问题,最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足,或者已经其他 issue 已经存在相关内容,你的 issue 有可能会被关闭。

Good luck and happy coding~

@ZakaryCode ZakaryCode transferred this issue from NervJS/taro May 14, 2020
@fjyhub
Copy link
Author

fjyhub commented May 21, 2020

没人给解决方案么?这个是整个框架底层有问题

@YunShengTeng
Copy link

图1:实现代码image

图2:nervjs的setState源码
image

图3:nervjs的clearCallBacks源码
image

图4:chrome调用栈时间轴
image

当第一setState执行完,render执行完,开始清理第一个setState的callback,从_pendingCallbacks数组中弹出callback执行,也就是f1,执行f1,遇到了setState,把f2push进_pendingCallbacks,f1执行完,检查_pendingCallbacks数组,还有一个f2,于是弹出f2,执行f2,但是其实这时state并没有更新,但是打印出的内容还是上次的state,这种场景下和React输出是不一致的。

@fjyGithub 我给出的方案:
1.不要这样写;
2.在第二个callback用setTimeout。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants