setState用法总结

1. setState传参

setState中，第一个参数可以传入对象，也可以是函数，第二个为可选参数，参数为一个回调函数，那么什么场景下传入对象？什么场景下使用函数，什么场景下需要传入第二个参数呢？

如果state的更新不依赖于之前的state中的值，使用对象
如果state的更新依赖之前state中的值，则第一个参数传入函数
如果state更新完成后立马需要使用state的值，则需要传入第二个参数

2. setState是同步还是异步

如果在react生命周期函数中使用setState或者直接在react事件回调函数中直接使用setState，此时是异步的

如果在setState在定时器回调 promise回调或者原生事件回调中，则是同步的

3. 异步setState多次调用如何处理

setState({}): 合并更新一次状态, 只调用一次render()更新界面 —状态更新和界面更新都合并了
setState(fn): 更新多次状态, 但只调用一次render()更新界面 —状态更新没有合并, 但界面更新合并了

setState用法总结相关推荐

你真的了解 setState 吗？
本文所有示例 setState 算是 React 里被使用的最高频的 api,但你真的了解 setState 吗?比如下面这段代码,你能清楚的知道输出什么吗? import { Component } ...
navigation笔记
react native存在的问题 vscode怎样打断点 _onPressButton()为什么以下划线命名 setState用法 render()用法eslint报错不懂的地方:不懂怎么调试不 ...
20170612-点滴记录
less中串联选择器的表示 .container {&.content {} } 上面的&符号表示串联选择器,&.content表示选择到.container.content这 ...
react中setState有三种用法
(1)对象 this.setState({}) (2)函数,一般是用于在setState之前做一些操作 this.setState(() => {// TODOconsole.log('')re ...
java中render用法_如何在React中不在render函数中使用setState
您不应该使用 componentWillReceiveProps ,因为在最新版本中,'s UNSAFE and it won'适用于React的异步呈现 . 还有其他方法! 在初始装载和后续更新时, ...
this.setState的详细用法
1.为什么不要直接对state进行赋值? 如果直接对this.state复制是不会去更新视图的,this.setState的原理是同一个队列来实现state的更新的,将需要更新的state放入到状态队 ...
Dorado用法与示例
Dorado用法与示例 dorado用后总结一.dorado概念 dorado的产品全名是"dorado展现中间件".从产品形态上dorado由两部分组成,第一部分是一个具有AJ ...
Redux 入门教程（一）：基本用法
一年半前,我写了<React 入门实例教程>,介绍了 React 的基本用法. React 只是 DOM 的一个抽象层,并不是 Web 应用的完整解决方案.有两个方面,它没涉及. 代码结构 ...
一文搞懂 CountDownLatch 用法和源码！
点击上方蓝色"方志朋",选择"设为星标" 回复"666"获取独家整理的学习资料! CountDownLatch 是多线程控制的一种工具,它被 ...

setState用法总结

1. setState传参

2. setState是同步还是异步

3. 异步setState多次调用如何处理

setState用法总结相关推荐

最新文章

热门文章