首页
学习
活动
专区
圈层
工具
发布

setState异步问题

今天使用react中setState后立马从state中获取,然后使用,发现时灵时不灵的,我立马意识到setState可能是异步的,翻看官方文档,果然: 调用 setState 其实是异步的 —— 不要指望在调用...如果你需要基于当前的 state 来计算出新的值,那你应该传递一个函数,而不是一个对象(详情见下文)。...代码不会像预期那样运行的示例: incrementCount() { // 注意:这样 *不会* 像预期的那样工作。...// 所以最终 `incrementCount()` 每次读取 `this.state.count` 的值都是 0,并将它设为 1。 // 问题的修复参见下面的说明。...因为 setState 的调用是分批的,所以你可以链式地进行更新,并确保它们是一个建立在另一个之上的,这样才不会发生冲突: 写法改为如下: incrementCount() { this.setState

92930
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    js中的异步与同步,解决由异步引起的问题

    之前在项目中遇到过好多次因为异步引起的变量没有值,所以意识到了认识js中同步与异步机制的重要性 在单线程的js中,异步代码会被放入一个事件队列,等到所有其他代码执行后再执行,而不会阻塞线程。...下面是js几种最常见的异步情况: 异步函数 setTimeout和setInterval 异步函数,如setTimeout和setInterval,被压入了称之为Event Loop的队列。...所以有时候也可以使用setTimeout解决异步带来的问题 setInterval:按照指定的周期(以毫秒数计时),将定时任务处理函数添加到执行队列的队尾。 Event Loop是一个回调函数队列。...当异步函数执行时,回调函数会被压入这个队列。JavaScript引擎直到异步函数执行完成后,才会开始处理事件循环。这意味着JavaScript代码不是多线程的,即使表现的行为相似。...ajax node.js中的许多函数也是异步的 解决由的js异步引起的问题办法: 命名函数 清除嵌套回调的一个便捷的解决方案是简单的避免双层以上的嵌套。

    2.8K20

    关于for循环里面异步操作的问题

    首先来看一个比较简单的问题,我们想实现的就是每隔1s输出0-4的值,就是这么简单,看下错误写法: function test() { for (var i = 0; i 异步操作,会先进行一次“保存”,等到整个for循环执行结束后,此时i的值已经变成5,因为setTimeout是写在for循环中的,相当于存在5次定时调用,这5次调用均是在for循环结束后进行的...变量值为“list[2]”即为3,item为3但是i的值已经变为3,又因为list[3]的值为undefined,所以这里输出3遍item3 undefined。...可以理解为一个封闭的代码块,该代码块中的代码会在定义时立即执行一遍,各个代码块的作用域彼此独立,不会污染外部环境,写法其实有很多种,上面只是一种,同样的还有使用void、+、-、!...等等,jquery源码就是直接使用的这里的圆括号写法的这种。

    1.5K00

    for循环异步操作问题小结

    在实际开发中,异步总是不可逃避的一个问题,尤其是Node.js端对于数据库的操作涉及大量的异步,同时循环又是不可避免的,想象一下一次一个数据组的存储数据库就是一个典型的循环异步操作,而在循环之后进行查询的话就需要确保之前的数据组已经全部存储在了数据库中...可以得到关于循环的异步操作主要有两个问题: 如何确保循环的所有异步操作完成之后执行某个其他操作 循环中的下一步操作依赖于前一步的操作,如何解决 如何确保循环的所有异步操作完成之后执行某个其他操作 方法一...:设置一个flag,在每个异步操作中对flag进行检测 let flag = 0; for(let i = 0; i < len; i++) { flag++; Database.save_method...,如何解决 方法一:使用递归,在异步操作完成之后调用下一次异步操作 function loop(i){ i++; Database.save_method().exec().then(() =>...loop() { for(let i = 0; i < len; i++) { await Database.save_method().exec(); } } 以上的方法基本上能解决大部分的问题

    2K20

    近期问题: jq循环中异步请求问题

    问题1: 今天开发遇到了一个问题, 页面中的列表是通过循环ajax进行请求的,最后需要对请求结束的数据进行判断和统计,所以就存在异步问题,当然不用ES6, 一开始想的是用 async:false, 使用后发现...请求代码如下: nodeList.forEach(function(val) { $.ajax({ ... }) }) 解决: 由于知道列表的总数, 所以我就设置了个计数器,每进入一个ajax...请求结束加一,最后判断到了列表总数一样的时候, 进行统计显示结果 问题2: 数组遍历ajax中,每次请求都会获取一个ip数组,例如 ?...ip数组 需要对这些ip进行前端显示,以及计数,即不存在的ip就显示到表格里,存在的ip计数加一 解决: 先写好生成表格的函数 当然那个生成空表格的,也可以使用以下的方法 new Array(3)....效果 随后,我们在遍历ajax中,将数组取出存入以ip为键,ip数量为值的对象中,然后将对象带入生成表格函数即可实时更新 // 这些都包裹在ajax的success中 ... ...

    1.2K20

    爬虫问题二:处理js异步加载问题

    前言 在新闻网站中大多采用的是异步加载模式,新闻条目会随滚动条的滚动而逐渐加载。当爬虫访问这类网站时得到的HTML数据仅仅是我们看到的页面数据,只有当我们向下滚动时,网页的源代码才会同步更新。...例如:腾讯新闻,处理这类JS异步加载的问题,这里用selenium来解决。...环境 Python 3.6.5 需要安装的包:selenium 编译器:sublime text 3 代码思路 导入需要用到的Python包 import selenium,time from selenium...(jsCode) 休息3秒,从JS异步加载的完成到新闻页面的更新需要一些时间 time.sleep(3) 进行标签定位,定位到class="item-pics"的标签 div = driver.find_elements_by_class_name...("item-pics") for each in div: each = each.find_element_by_tag_name("a") 打印爬取到的内容 print(each.text) ?

    3.4K50

    同步与异步电路信号交互的问题

    1.同步电路设计 2.全异步电路设计 3.异步信号与同步电路交互的问题及其解决方法 4.SoC设计中的时钟规划策略 1.同步电路设计 同步电路,即电路中的所有受时钟控制的单元,如触发器(...异步电路设计的基本原理 自定时的流水线数据通路 握手协议 握手协议原理 异步电路设计的优点 模块化特性突出 对信号的延迟不敏感 没有时钟偏斜问题 有潜在的高性能特性 好的电磁兼容性 具有低功耗的特性...异步电路设计的缺点 设计复杂 缺少相应的EDA工具的支持 在大规模集成电路设计中应避免采用异步电路设计 3.异步信号与同步电路交互的问题及其解决方法 3.1亚稳态现象 亚稳态示意图...,执行FIFO读动作,读出被异步时钟域写入FIFO的数据 如果只要同步一个数据,空标志位再次有效 如果需要同步多个数据,因为FIFO的读/写之间可以不受影响的进行,所以待同步 FIFO设计中的亚稳态问题...(DFT)的插入工作得到最大的简化 其次,注意同步电路设计的缺陷 噪声问题 时钟树上的功耗很大 如果必须采用不同的时钟,则要注意 后端设计的复杂化,如约束条件中要考虑多周期路径(Multi Cycle

    1.2K21

    JavaScript 同步和异步的执行机制问题

    今天做项目的时候遇到了一个问题,当我在请求完后端数据的时候,想去立刻打印出请求出来的信息时,怎么打印都是空的,但是出来这个请求方法之后他又有数值了,于是我很纳闷,研究了1个小时找出了原因。...Event Loop(事件循环)是 JavaScript 的执行机制。 下面我不会直接回答那个问题,而是举别的例子,如果这些例子都搞明白了,那么上面的代码有什么问题相信大家也就都知道了。...单线程就是使用队列的机制,所有的任务都排着队的执行,在前面排队的任务就先执行,即 先进先出 。 异步的任务不会先执行,而是先放入一个事件列表,等到主线任务执行完之后再去执行这些事件列表中的数据。 ?...同步和异步任务分别进入不同的执行环境,同步的进入主线程,异步的写入 Event Table 事件列表中。 当事件完成时,把事件列表中的任务推入 Event queue 事件队列,等待执行。...上面这个步骤会重复执行,知道没有可执行的任务,形成事件循环(Event Loop) 下面介绍几个异步函数 setTimeout 异步函数,可以延迟执行。

    1.1K10

    异步调用导致的不同步问题

    ,最近遇到一个问题,是在ie11才发现的,点击按钮时候,后台打断点加数据库查询都验证数据是保存正确的,不过已经保存的数据是带不到弹窗页面的,问题比较奇怪,排查了挺长时间,最开始因为在ie才能重现的问题,...在极速模式的360浏览器是没问题的,而且第一次点击时候没带出数据,第二次点击时候才可以带出数据,然后很容易让人联想到ie的缓存问题,不过调了大半天 加上ajax不缓存的代码,已经改成post请求,或者...请求连接后面加上一个时间戳参数都不奏效 $(function(){ //ajax不缓存请求结果 $.ajaxSetup({cache: false}); }); 然后经过和同事沟通,才发现自己跟错了方向,经过检查发现保存的方法是用异步的...,问题就出现在这里了,首先验证是不是由于异步导致的,在保存数据代码和打开弹窗页面的代码之间加一个alert提示,发现果然,关联alert弹窗提示之后,数据正常带出,所以确定是因为异步导致的 保存的代码,...注意async:true,,这里是异步的,之前可能是考虑性能问题,改成异步的 $.ajax({ url:'${root}/saveOrUpdate.do', type:"post",

    65330

    记一个异步循环遍历的问题

    以下所有操作都是使用的 mongoose ,另外 schema 和 model 定义这些无关紧要的部分统统省略了,无需深究代码的细节处。...从 doc 数组中遍历每一个元素的 phone 属性,去另外一张表中查询 phone 匹配的数据,合并对象,然后返回结果。...过程 ---- 第一阶段:天真的想当然 知道点异步流程的同学都明白,最终的result肯定是为空的。 第二阶段:加个计数器吧 加个计数器,然后一直循环判断计数是否完成。...我们都知道 node 是基于异步的事件循环机制,但是当我们这里使用 while 循环判断时,这个 while 本质上是一个同步的代码,其是无法与事件循环机制的钩子对接,所以无法跳出这个同步的 while...promise 嵌套 promise 的情况,我觉得你应该重新思考下 promise ,就这样吧,记录一个很小的问题,至于 async/await 暂时还不想写在这里。

    1.3K20

    JavaScript——promise 是解决异步问题的方法嘛

    前言 promise 异步解决方案 步骤 Promise 对象是 JavaScript 的异步操作解决方案,为异步操作提供统一接口。...它起到代理作用(proxy),充当异步操作与回调函数之间的中介,使得异步操作具备同步操作的接口。Promise 可以让异步操作写起来,就像在写同步操作的流程,而不必一层层地嵌套回调函数。...Promise解决了callback回调地狱的问题,async、await 是异步的终极解决方案。...2)Promise Promise就是为了解决callback的问题而产生的。...优点: 代码清晰,不用像 Promise 写一大堆 then 链,处理了回调地狱的问题 缺点: await 将异步代码改造成同步代码,如果多个异步操作没有依赖性而使用 await 会导致性能上的降低。

    34510

    高优异步任务解决双重异步集合点阻塞问题

    在性能测试的实践当中,异步任务是离不开的。Java异步编程提高了应用程序的性能和响应性,通过避免线程阻塞提高了资源利用率,并简化了并发编程的复杂性。改善用户体验,避免死锁和线程阻塞等问题。...缘起 我也参照了 Go 语言的 go 关键字,自定义了 fun 关键字Java自定义异步功能实践 。...但是在使用过程中,遇到了一个略显尴尬的问题,就是如果当一个异步任务中,又增加一个异步任务,且使用集合点设置。那么就会阻塞线程池,导致大量任务阻塞的情况。...,等于最大线程数的任务会阻塞在 pushHomework() 方法中,而 pushHomework() 方法需要完成的异步任务又全都等待在线程池的等待队列中。...但也无法解决问题,因为依然存在阻塞的问题,只不过概率变小了而已。看来不得不使用单独的异步线程池来实现了。 关于线程池的选择有两种选择: 选择最大线程数较小的线程池,只是作为辅助功能,防止阻塞。

    24510

    es7 awaitasync解决异步问题

    最近做项目遇到一个问题,前端调用ie浏览器中的ocx的方法去查询数据,查询完之后ocx给一个返回值,然后js将返回值当参数传入到另外的函数中去做数据处理,但是遇到一个问题是前端需要异步去执行这个过程 ?...第一行是js调用ocx的方法查询数据,并将返回值保存在code中 第三行是js将返回的code值当参数传入到flex的函数中,这个执行时需要异步的即code有值之后才能执行这一行代码 虽然后台可以写个事件来解决这个问题...,但是我想知道前端是否能解决,于是通过查看资料发现es7有一个新特性:await/async可以解决异步的问题 ?...遗憾的是IE尚不支持es7的这个语法,所以最终还是由后台来解决了

    60610

    异步事务?关于异步@Async + 事务@Transactional的结合使用问题分析【享学Spring MVC】

    @Async的使用 关于它的基本使用原理篇,这篇文章其实有过非常详细的分析了,可前往此处深入了解:【小家Spring】Spring异步处理@Async的使用以及原理、源码分析(@EnableAsync)...:fsx-Executor-1 play线程:fsx-Executor-2 这里我用一个比较极端的案例来说明问题:主线程调用异步线程,异步线程里继续调用异步线程的case。...那么现在开始引入本文关注的情景:@Async + @Transactional把异步和事务结合起来。...eat和play表均插入无效(被回滚) 结论:同上 场景四: 此场是我模拟的最后一个场景:异步线程里继续调用异步线程,并且加上事务。...eat插入无效(被回滚),play插入成功 结论:不同线程之间的事务完全隔离,异步线程内仍是可以调用异步~ 总结 本文没有新的内容,源于跟一个小伙伴讨论这块时,自己也有些打鼓的地方,因此就写了本文做一个记录

    10.6K42

    解决 Vuex 中异步问题:获取最新的 Token 值

    解决 Vuex 中异步问题:获取最新的 Token 值 在使用 Vuex 管理状态时,有时会遇到异步问题,特别是在获取异步数据并将其保存到 Vuex 中后,立即获取该数据时可能会出现问题。...在这篇文章中,我们将讨论如何解决这个问题,并确保在获取 Token 值时始终获取到最新的值。 问题背景 假设我们有一个 Vuex 模块 auth,其中包含了登录、登出和检查 Token 的方法。...在登录成功后,我们将 Token 保存到 Vuex 的状态中,并且在需要的时候从状态中获取 Token 值。...由于异步问题,当我们立即调用 getToken 方法时,它可能会返回 null 值,因为在调用 getToken 时,SET_TOKEN 方法可能还没有被调用。...解决方案 为了解决这个问题,我们需要将 getToken 方法移到 state 中,并定义一个 getter 来获取 Token 的值。

    69100

    笔记|Unity异步处理与UI Text显示的问题

    前言 这阵子一有空就在研究Unity3D网络通讯,使用过程中访问通过协程的方式收到返回的数据直接更新Text的显示值都没有问题,结果在处理Socket通讯TCP方式采用异步时遇到了问题,本章主要就是记录一下测试的过程和处理方法...所以首先,请你牢记:协程不是线程,也不是异步执行的。协程和 MonoBehaviour 的 Update函数一样也是在MainThread中执行的。使用协程你不用考虑同步和锁的问题。...从上面这段话来说,协程不是异步执行的,所以text更新可以直接显示,而使用BeginRead时是异步线程操作的,做过多线程开发的同学应该都处理过线程与UI进行同步的问题(Andorid的开发可能更多),...我在Tcp通讯的Recv方法里面,使用BeginRead异步处理之前,先调用一下Action的方法,看看效果怎么样。 ?...从上图中可以看到,在进入BeginRead之前,我们直接调用action的方法后,Text也是直接显示出来的没有问题了,这就验证了上面所说的问题,所以我们下一步就考虑怎么处理线程和UI同步的问题即可。

    2.5K30
    领券