当前位置: 首页 > news >正文

react的setState做了什么

1、为什么需要setState

setState的作用是帮助我们更改数据的同时并且通知视图进行渲染。因为React并不会绑定视图和state,需要我们手动去更新视图。

2、setState什么时候是同步的,什么时候是异步的

setState这个方法在调用的时候是同步的,但是引起React的状态更新是异步的。在React中,如果是由React引发的事件处理(比如是通过onClick引发的事件处理,以及生命周期函数调用setState),调用setState不会同步更新this.state,除此之外的setState调用会同步执行this.state。
所谓"除此之外",指的是绕过React通过addEventListener直接添加的事件处理函数,还有通过setTimeout/setInterval产生的异步调用。

原因:

在 React 的 setState 函数实现中,会根据一个变量 isBatchingUpdates 判断是直接更新 this.state 还是放到队列中回头再说,而 isBatchingUpdates 默认是 false,也就表示 setState 会同步更新 this.state,但是,有一个函数 batchedUpdates,这个函数会把 isBatchingUpdates 修改为 true,而当 React 在调用事件处理函数以及生命周期函数之前就会调用这个 batchedUpdates,造成的后果,就是由 React 控制的事件处理过程 setState 不会同步更新 this.state。

React 的 batchUpdate 机制会在每一个方法执行之前设置一个 isBatchingUpdate 为 true,在方法执行结束之后设置 isBatchingUpdate 为 false 。那么当在执行 setState 这句代码的时候,如果 isBatchingUpdate 是 true,就命中了 batchUpdate 机制,会进行 “异步更新”;反之则是 “同步更新”。

3、setState的参数

setState(updater, [callback]),setState 可以接受两个参数,第一个参数可以是一个对象或者是一个函数,都是用来更新 state。如果需要对state数据更改监听,就可以使用第二个参数,它是用来监听state里面数据的更改,当数据更改完成,调用回调函数,用于可以实时的获取到更新之后的数据。

相关文章:

react的setState做了什么

1、为什么需要setState setState的作用是帮助我们更改数据的同时并且通知视图进行渲染。因为React并不会绑定视图和state,需要我们手动去更新视图。 2、setState什么时候是同步的,什么时候是异步的 setState这个方法在调用的时候是同步的,…...

ubuntu18.04 RTX3060 rangnet++训练 bonnetal语义分割

代码链接: https://github.com/PRBonn/lidar-bonnetal 安装anaconda环境为 CUDA 11.0(11.1也可以) anaconda环境如下 numpy1.17.2 torchvision0.2.2 matplotlib2.2.3 tensorflow1.13.1 scipy0.19.1 pytorch1.7.1 vispy0.5.3 opencv_python…...

Linux:权限是什么

本篇文章来简单介绍一下Linux操作系统中权限的基本概念和一些操作方法,对Linux权限有一个基本的了解,希望对大家学习Linux有所帮助。 目录 1.权限的概念 2.Linux权限管理 2.1 文件访问者的分类 2.2 文件类型与访问权限(事物属性&#xff…...

uni-app yrkDataPicker 日期和时间选择控件

uni-app 选择日期时间控件有 2 月份有 31 天的问题&#xff0c;一直没有修复&#xff0c;uni-calendar 苹果有选择年份和月份后无法显示问题。自己写了一个&#xff0c;只支持 H5 和微信小程序&#xff0c;其他没有试过。 <template><view class"yrk-data-picke…...

PAM从入门到精通(十九)

接前一篇文章&#xff1a;PAM从入门到精通&#xff08;十八&#xff09; 本文参考&#xff1a; 《The Linux-PAM Application Developers Guide》 PAM 的应用开发和内部实现源码分析 先再来重温一下PAM系统架构&#xff1a; 更加形象的形式&#xff1a; 六、整体流程示例 2.…...

apache httpd 多后缀解析漏洞

形成原因 Apache HTTPD 支持一个文件拥有多个后缀&#xff0c;并为不同后缀执行不同的指令 在有多个后缀的情况下&#xff0c;只要一个文件含有.php后缀的文件即将被识别成PHP文件&#xff0c;没必要是最后一个后缀。利用这个特性&#xff0c;将会造成一个可以绕过上传白名单…...

Flutter ☞ 数据类型

数值类型 int、double、num int 整型&#xff0c;取值通常在 -253 ~ 253 之间 int class double 64-bt(双精度)浮点数&#xff0c;符合 IEEE 754 标准。 double class num 数值类型的基类&#xff0c;int 和 double 都继承自num。 num class 数值转换 // String -> …...

MyBatis-Plus 实战教程一

这里写目录标题 简介快速上手数据库建立创建实体类修改参数引入依赖测试常见注解介绍TableNameTableIdTableField 常见配置仓库地址 简介 MyBatis-Plus&#xff08;简称 MP&#xff09;是一个 MyBatis 的增强工具&#xff0c;在 MyBatis 的基础上只做增强不做改变&#xff0c;…...

闭包(函数)

把内部函数通过return扔出去 必要条件...

Go包介绍与初始化:搞清Go程序的执行次序

Go包介绍与初始化&#xff1a;搞清Go程序的执行次序 文章目录 Go包介绍与初始化&#xff1a;搞清Go程序的执行次序一、main.main 函数&#xff1a;Go 应用的入口函数1.1 main.main 函数1.2 main.main 函数特点 二、包介绍2.1 包介绍与声明2.2 非 main包的 main 函数2.3 包的命名…...

Python教程(15)——Python流程控制语句详解

目录 if语句else if语句for循环遍历类型range关键字 while循环break语句continue语句 Python流程控制是Python编程中非常重要的一部分&#xff0c;它用于控制程序的执行流程。Python提供了多种流程控制语句&#xff0c;包括if语句、while循环、for循环、break和continue语句等。…...

JavaScript基础知识16——分支语句

哈喽&#xff0c;大家好&#xff0c;我是雷工。 今天学习JavaScript基础知识的分支语句&#xff0c;以下为学习笔记。 1、程序三大流程控制语句 ○写几句就从上往下执行几句&#xff0c;这种叫做顺序结构&#xff1b; ○有时要根据条件选择执行代码&#xff0c;这种叫分支结构…...

web开发初级工程师学习笔记

web开发初级工程师学习笔记 前端开发工具实验1 VS Code 初体验介绍 前端开发工具 实验1 VS Code 初体验 介绍 VS Code 环境提供的是一个可以在浏览器中使用原生 VS Code 编辑代码的程序。在该环境中&#xff0c;你可以使用到与本地安装近乎一致的 VS Code 程序来编辑代码文件…...

Linux下Samba服务安装及启用全攻略

Linux下Samba服务安装及启用全攻略 前言一、安装SSH Server二、安装Samba Server1.安装net-tool2.建立账号的samba3.windows通过Samba与linux共享文件4.使用远程工具登录Linux 总结 前言 提示&#xff1a;本文详解了在Linux系统下如何安装和启用Samba服务&#xff0c;涵盖了从…...

【C++】引用’‘的深入解析

&#x1f490; &#x1f338; &#x1f337; &#x1f340; &#x1f339; &#x1f33b; &#x1f33a; &#x1f341; &#x1f343; &#x1f342; &#x1f33f; &#x1f344;&#x1f35d; &#x1f35b; &#x1f364; &#x1f4c3;个人主页 &#xff1a;阿然成长日记 …...

java链式编程对象序列化问题

在使用 openfeign 进行服务之间数据传输时发现了一个问题&#xff0c;数据在下游正常处理&#xff0c;响应到调用端数据也读取到了&#xff0c;但是就是 jackson 转对象序列化时出了问题&#xff0c;异常如下 Failed to complete request: feign.codec.DecodeException: Type d…...

关于Redis(Redisson)超时问题的分析

概述 生产环境中流量高峰期会出现短时间的redis异常&#xff0c;主要报错如下&#xff1a; Redis server response timeoutRedisTimeoutException: Command execution timeout for command: (PING)Command still hasn’t been written into connection! 根据redisson官方所述…...

Redis 主从复制,哨兵,集群——(2)哨兵篇

目录 1. Redis 哨兵是什么&#xff1f; 2. Redis 哨兵有什么用&#xff1f; 2.1 主动监控 2.2 消息通知 2.3 故障转移 2.4 配置中心 3. Redis 哨兵数量配备要求 4. 哨兵配置文件详解 5. quorum 投票数详解 5.1 quorum 的含义 5.2 网络抖动导致主观下线 5.3 quorum …...

C++入门笔记分享

有道云笔记...

使用conda install一直卡在solving environment的解决方法

使用国内镜像源&#xff0c;但install仍旧一直卡在solving environment&#xff0c;超过10分钟就不用等了&#xff1b; 检查C:\Users\UserName 路径下的.condarc文件 将这个defaults这一行删掉即可...

3分钟快速上手:手机号找回QQ号的终极完整指南

3分钟快速上手&#xff1a;手机号找回QQ号的终极完整指南 【免费下载链接】phone2qq 项目地址: https://gitcode.com/gh_mirrors/ph/phone2qq 你是否曾经因为忘记QQ号而无法登录&#xff1f;新手机到手想登录QQ&#xff0c;却只记得绑定的手机号&#xff1f;或者需要同…...

mysql备份期间如何监控系统负载_使用iostat与top命令

iostat -x 1重点看%util、await、svctm&#xff1a;若%util持续>90%且await>50ms&#xff0c;磁盘成瓶颈&#xff1b;SSD需结合r/s、w/s、吞吐量判断&#xff1b;物理备份写NAS时await高多因网络延迟。备份时磁盘 I/O 突增&#xff0c;iostat 怎么看关键指标MySQL 备份&a…...

Redis如何在应用启动时预热缓存数据

不可靠。应用启动时直接调用 redis-cli 或客户端批量写入易因 Redis 未就绪、网络不通、认证失败等导致失败&#xff0c;且缺乏重试、超时、幂等控制&#xff1b;应优先在应用层用客户端实现预热&#xff0c;并做好健康检查、分批写入与内存管控。应用启动时调用 redis-cli 或客…...

Zotero-OCR插件:3步实现PDF文献智能识别与可搜索文本层添加

Zotero-OCR插件&#xff1a;3步实现PDF文献智能识别与可搜索文本层添加 【免费下载链接】zotero-ocr Zotero Plugin for OCR 项目地址: https://gitcode.com/gh_mirrors/zo/zotero-ocr Zotero-OCR是Zotero文献管理软件的功能扩展插件&#xff0c;专门为PDF文档添加可搜索…...

Chandra AI聊天助手响应速度优化:异步处理实战

Chandra AI聊天助手响应速度优化&#xff1a;异步处理实战 1. 引言 你有没有遇到过这样的情况&#xff1a;向AI助手提问后&#xff0c;眼睁睁看着光标转圈圈&#xff0c;等待时间长得足以让你泡杯咖啡&#xff1f;特别是在使用本地部署的AI聊天助手时&#xff0c;响应速度往往…...

ESP32 SPI读写SD卡实战:从硬件连接到FATFS文件操作,一篇搞定所有坑

ESP32 SPI读写SD卡实战&#xff1a;从硬件连接到FATFS文件操作&#xff0c;一篇搞定所有坑 在嵌入式开发中&#xff0c;SD卡存储是扩展设备数据容量的常见方案。ESP32作为一款高性价比的Wi-Fi/蓝牙双模芯片&#xff0c;其SPI接口与SD卡的配合使用尤为广泛。本文将带你从硬件连…...

VOT-Toolkit实战:从零配置到性能分析,手把手教你搞定视觉跟踪评测

1. 环境准备&#xff1a;从零搭建Linux评测环境 第一次在Linux系统上配置VOT-Toolkit时&#xff0c;我花了整整两天时间解决各种依赖问题。现在回想起来&#xff0c;其实只要把几个关键环节打通&#xff0c;整个过程可以压缩到30分钟内完成。我们先从最基础的系统环境说起。 系…...

告别VGA驱动困惑:用Verilog在Cyclone IV FPGA上实现800x60彩条与字符显示(附完整代码)

FPGA实战&#xff1a;用Verilog在Cyclone IV上实现VGA彩条与字符显示系统 第一次接触FPGA驱动VGA显示时&#xff0c;我被那些复杂的时序参数和硬件连接弄得晕头转向。屏幕要么一片漆黑&#xff0c;要么显示错位的彩色条纹&#xff0c;调试过程简直是一场噩梦。直到真正理解了从…...

探秘书匠策AI:期刊论文写作的“智慧魔法棒”

在学术的广袤天地里&#xff0c;论文写作就像是一场充满挑战与惊喜的冒险之旅。对于众多莘莘学子以及科研工作者而言&#xff0c;撰写一篇高质量的期刊论文&#xff0c;无疑是这场冒险中的关键关卡。而今天&#xff0c;我要给大家介绍一位神秘的“智慧魔法棒”——书匠策AI&…...

别再踩坑了!Ubuntu 20.04/22.04下禾赛Pandar系列激光雷达ROS驱动保姆级安装指南

Ubuntu 20.04/22.04下禾赛激光雷达ROS驱动安装避坑指南 刚拿到禾赛Pandar系列激光雷达时&#xff0c;那种兴奋感我至今记得——直到在Ubuntu系统上折腾ROS驱动连续报错三天。如果你正在经历catkin_make编译失败、rviz里死活看不到点云、或者依赖库版本冲突的绝望时刻&#xff…...