对于react中的this.setState的理解
一、this.setState第二个参数的作用:修改数据更新后最新的DOM结构
二、this.setState为什么是异步的?
1.setState只在合成事件和钩子函数中是“异步”的,在原生事件和setTimeout中都是同步的。
2.setState的“异步”并不是说内部由异步代码实现,其实本身执行的过程和代码都是同步的,
只是合成事件和钩子函数的调用顺序在更新之前,导致在合成事件和钩子函数中没法立马拿到更新后的值,形式了所谓的“异步”,当
然可以通过第二个参数setState(partialState,callback)中的callback拿到更新后的结果。
3.setState的批量更新优化也是建立在“异步”(合成事件、钩子函数)之上的,
在原生事件和setTimeout中不会批量更新,在“异步”中如果对同一个值进行多次setState,setState的批量更新策略会对其进行覆盖,取最后一次的执行,
如果是同时setState多个不同的值,在更新时会对其进行合并批量更新。
对于react中的this.setState的理解的更多相关文章
- React 中的this.setState
在react中如何修改state中的数据 第一种写法:this.setState() 参数1:对象 需要修改的数据 参数2:回调 this.setState是一 ...
- react中的this.setState()
修改组件的状态可以使用的一些方法: 1.比较常用的 this.setState({ message:"你好" }) 2.state更新是异步的时候 因为this.props和thi ...
- react中对于key值的理解
1.key是用来帮助react识别哪些内容被更改.添加或者删除.key需要写在用数组渲染出来的元素内部,并且需要赋予其一个稳定的值.如果key值发生了变更,react则会触发UI的重渲染. 2.在相邻 ...
- react 中组件状态的一些理解
组件状态:即 state 只有当state发生变化时,组件才会更新. 当一个html标签的值依赖于state的值得时候,如果state的值没有更新时,这个标签的值无论如何也是不会更新的. 看下面示例: ...
- react中state与setstate的使用
我们可以利用state来定义一些变量的初始值 //放在construcor里 this.state = { list: [1, 2, 3] } 要更改state里的值,注意要遵循react里immut ...
- React中setState学习总结
react中setState方法到底是异步还是同步,其实这个是分在什么条件下是异步或者同步. 1.先来回顾一下react组件中改变state的几种方式: import React, { Compone ...
- react中的setState的使用和深入理解
前端框架从MVC过渡到MVVM.从DOM操作到数据驱动,一直在不断的进步着,提升着, angular中用的是watcher对象,vue是观察者模式,react就是state了,他们各有各的特点,没有好 ...
- react中this.setState的理解
this.setState作用? 在react中要修改this.state要使用this.setState,因为this.state只是一个对象,单纯的修改state并不会触发ui更新.所以我们需要用 ...
- React中setState的怪异行为 ——setState没有即时生效
setState可以说是React中使用频率最高的一个函数了,我们都知道,React是通过管理状态来实现对组件的管理的,当this.setState()被调用的时候,React会重新调用render方 ...
随机推荐
- Python函数中的列表
在看21天的Python书中写出了一个陷阱,但没给出解释,以下为代码陷阱
- Maven的安装、配置及使用入门+maven安装报错:JAVA_HOME【申明:来源于网络】
Maven的安装.配置及使用入门+maven安装报错:JAVA_HOME[申明:来源于网络] Maven的安装.配置及使用入门:http://www.cnblogs.com/dcba1112/arch ...
- vue中打包后vendor文件包过大
vue中webpack打包后vendor.xxx.js文件一般都特别大,其原因是因为我们引用的依赖都被压缩成一个js文件,这样会导致vendor文件过大.页面加载速度过慢,影响用户体验.所以我们就要把 ...
- KXO151 Programming & Problem Solving
Page 1 of 9KXO151 Programming & Problem SolvingAIEN-SOU - 2019Assignment 2Deadline for Submissio ...
- Mac ssh启动和停止
原文地址:http://blog.csdn.net/cwj649956781/article/details/37913637 mac本身安装了ssh服务,默认情况下不会开机自启 1.启动sshd服务 ...
- shell 字符串比较 算数比较 文件条件测试
set-group-id即set-gid -->授予了程序其所在组的访问权限 set-user-id即set-uid -->授予了程序其拥有者的访问权限而不是其使用者的访问权限 set-g ...
- Linux/Windows 应用程序开发
一.基础知识 虽然写的都是代码,但是代码运行在哪个级别什么位置,还是需要做好定位,这样才心中有数. 1.1 Linux [转载]讲述了中断.系统调用.Linux APIs和Shell的基本知识. 1 ...
- 制作自己的docker镜像
制作自己的Docker镜像主要有如下两种方式: 1.使用docker commit 命令来创建镜像 通过docker run命令启动容器 修改docker镜像内容 docker commit提交修改的 ...
- 接口测试工具-Jmeter使用笔记(八:模拟OAuth2.0协议简化模式的请求)
背景 博主的主要工作是测试API,目前已经用Jmeter+Jenkins实现了项目中的接口自动化测试流程.但是马上要接手的项目,API应用的是OAuth2.0协议授权,并且采用的是简化模式(impli ...
- JAVA学习笔记 (okHttp3的用法)
最近的项目中有个接口是返回文件流数据,根据我们这边一个验签的插件,我发现里面有okHttpClient提供了Call.Factory,所以就学习了下okHttp3的用法. 1.概述 okhttp是一个 ...