jlabel 不能连续两次set_为什么有时连续多次setState只有一次生效？

例如下面的代码，两次打印出的结果是相同的：

componentDidMount() {

this.setState({ index: this.state.index + 1 }, () => {

console.log(this.state.index);

})

this.setState({ index: this.state.index + 1 }, () => {

console.log(this.state.index);

})

}

原因就是 React会批处理机制中存储的多个 setState进行合并，来看下 React源码中的 _assign函数，类似于 Object的 assign：

_assign(nextState,typeof partial ==='function'?partial.call(inst,nextState,props,context):partial);

如果传入的是对象，很明显会被合并成一次，所以上面的代码两次打印的结果是相同的：

Object.assign(

nextState,

{index: state.index+ 1},

{index: state.index+ 1}

)

注意， assign函数中对函数做了特殊处理，处理第一个参数传入的是函数，函数的参数 preState是前一次合并后的结果，所以计算结果是准确的：

componentDidMount() {

this.setState((state, props) => ({

index: state.index + 1

}), () => {

console.log(this.state.index);

})

this.setState((state, props) => ({

index: state.index + 1

}), () => {

console.log(this.state.index);

})

}

所以上面的代码两次打印的结果是不同的。

最佳实践

React会对多次连续的 setState进行合并，如果你想立即使用上次 setState后的结果进行下一次 setState，可以让 setState 接收一个函数而不是一个对象。这个函数用上一个 state 作为第一个参数，将此次更新被应用时的 props 做为第二个参数。

jlabel 不能连续两次set_为什么有时连续多次setState只有一次生效？相关推荐

MySQL计算指标连续两月金额相比_20160929
在正常的业务逻辑中,对客户的分析是必须的也是最经常用到的,根据时间维度计算计算指标连续两月环比情况也是一道必须面对的题目. 国庆放假先写代码后面再拆分解释 SELECT a.*,b.年月 AS 上 ...
某阿里8年资深程序员求助：连续两次绩效挂掉，被hr辞退不给n+1，怎么办？
背低绩效.被辞退.不给赔偿.劳动仲裁--这些都是打工人们常常会碰到的恶心事,没经验的小白一旦遇上会就会不知所措.但即使是工作多年的大佬也未必具备相关知识,这不,一个在阿里工作了8年的程序员就遇到了类似 ...
阿里程序员连续两次绩效3.25！大老板威胁要开除他！还不给赔偿金！问大家该如何维权？...
请点击上面一键关注! 职场中人总会遇到各种想象不到的侵权行为,一个阿里巴巴的员工发帖哭诉自己连续两次绩效3.25,大老板说要开除他,还没有N+1,问大家该怎么维权? 面对如此明目张胆地欺负,网友们怒 ...
2021 AAAI Fellow名单重磅出炉，华人学者遗憾连续两年无缘入选 | AI日报
2021 AAAI Fellow名单重磅出炉,华人学者遗憾连续两年无缘入选据AAAI 官方推特消息,AAAI将新增10位Fellow,表彰他们在强化学习.自然语言处理.视觉等方面的所作出的贡献. A ...
第四范式连续两年入选CB Insights全球AI百强榜
近日,全球知名创投研究机构CB Insights发布了2020全球AI百强创业公司榜单"AI 100",遴选出了2020 年全球 100 家最有前景的人工智能公司.凭借AI产业化落 ...
php 连续点击事件,javascript设置连续两次点击按钮时间间隔的方法_javascript技巧...
本文实例讲述了javascript设置连续两次点击按钮时间间隔的方法,分享给大家供大家参考.具体实现方法如下: 很多时候我们在实际应用中,可能并不希望按钮联系被不间断的点击,所以要限定一定的时间间隔才 ...
IBM连续两年大数据市场占有率全球第一
ZDNet至顶网服务器频道 04月22日新闻消息:IBM 近日宣布,根据市场调研机构Wikibon最新研究报告<大数据供应商收益与市场预测>,IBM连续两年实现大数据市场占有率第一,领跑 ...
连续两年入选Gartner公共云容器，阿里云在边缘容器方面做了什么？
最近,Gartner发布了2020年公共云容器报告,阿里云连续两年成为唯一入选的中国企业.报告显示,阿里云容器服务在中国市场表现强劲,产品形态丰富,在 Serverless 容器.服务网格.安全沙箱容 ...
Wi-Fi 6连续两年出货量国内登顶，锐捷无线靠什么这么6？
近日,国际数据咨询公司IDC发布<2020年第四季度中国企业级WLAN市场跟踪报告>.数据显示,锐捷网络Wi-Fi 6产品全年出货量超过70万,位列Wi-Fi 6品类出货量第一,市场占比3 ...

jlabel 不能连续两次set_为什么有时连续多次setState只有一次生效？

jlabel 不能连续两次set_为什么有时连续多次setState只有一次生效？相关推荐

最新文章

热门文章