React中setState注意事项

时间:2022-05-12 00:19:39

setState是一个异步函数,异步获取数据

学习react在使用ref和setState操作DOM时会遇到的问题:

ref获取ul结点元素

React中setState注意事项

错误写法:得到的ul长度总是上一次输入后的长度

React中setState注意事项

结果:

React中setState注意事项

正确写法:setState异步函数第二个回调函数在第一个参数执行完成后执行

React中setState注意事项

结果:

React中setState注意事项

React中setState注意事项的更多相关文章

  1. React中setState学习总结

    react中setState方法到底是异步还是同步,其实这个是分在什么条件下是异步或者同步. 1.先来回顾一下react组件中改变state的几种方式: import React, { Compone ...

  2. React中setState同步更新策略

    setState 同步更新 我们在上文中提及,为了提高性能React将setState设置为批次更新,即是异步操作函数,并不能以顺序控制流的方式设置某些事件,我们也不能依赖于this.state来计算 ...

  3. React中setState如何修改深层对象?

    在React中经常会使用到setState,因为在react生态中,state就是一切.在开发过程中,时长会在state中遇到一些比较复杂的数据结构,类似下面这样的: 这时需要我们修改list中obj ...

  4. React中setState的怪异行为 ——setState没有即时生效

    setState可以说是React中使用频率最高的一个函数了,我们都知道,React是通过管理状态来实现对组件的管理的,当this.setState()被调用的时候,React会重新调用render方 ...

  5. React中setState 什么时候是同步的,什么时候是异步的?

    class Example extends React.Component { constructor() { super(); this.state = { val: 0 }; } componen ...

  6. react中setState用法

    setState()更新状态的2种写法 setState(updater, [callback]), updater为返回stateChange对象的函数: (state, props) => ...

  7. 「React Native笔记」在React的 setState 中操作数组和对象的多种方法(合集)

    运用在React 中 setState的对象.数组的操作时是不能用类似array.push()等方法,因为push没有返回值,setState后会出现state变成Number,为了方便他人和自己查看 ...

  8. React 中的this.setState

    在react中如何修改state中的数据     第一种写法:this.setState()         参数1:对象 需要修改的数据         参数2:回调 this.setState是一 ...

  9. React中this.setState是同步还是异步?为什么要设计成异步?

    在使用react的时候,this.setState为什么是异步呢? 一直以来没有深思这个问题.昨天就此问题搜索了一下. react创始人之一 Dan Abramovgaearon在GitHub上回答了 ...

随机推荐

  1. webpack初学

    写在前面的话 阅读本文之前,先看下面这个webpack的配置文件,如果每一项你都懂,那本文能带给你的收获也许就比较有限,你可以快速浏览或直接跳过:如果你和十天前的我一样,对很多选项存在着疑惑,那花一段 ...

  2. 由RGB到HSV颜色空间的理解

    1. RGB模型 2. HSV模型 3. 如何理解RGB与HSV的联系 4. HSV在图像处理中的应用 5. opencv中RGB-->HSV实现 在图像处理中,最常用的颜色空间是RGB模型,常 ...

  3. Android最方便的数据库--LitePal

    郭最近看到神分析LitePal相框,我感觉很强烈,尝试了一下,真的好,我不知道,如果你不习惯学习,那么各不相同,我觉得很合适 看完之后,思想,对于我来说,,实体到set颂值,如果数据非常多,那么你可以 ...

  4. linux TOP参数

    TOP参数 top - 01:06:48 up  1:22,  1 user,  load average: 0.06, 0.60, 0.48Tasks:  29 total,   1 running ...

  5. MFCC特征参数提取流程概述

      一 概念概述: 在语音识别(Speech Recognition)和话者识别(Speaker Recognition)方面,最常用到的语音特征就是梅尔倒谱系数(Mel-scale Frequenc ...

  6. 黄聪:JQUERY判断操作CHECKBOX选中、取消选中、反选、第二次无法选中的问题

    用JQuery做CheckBox全选和反选的时候,遇到一个问题.当用JQ控制全选,全取消一次以后,再次点击全选,发现代码变了,但是CheckBox没有处于选中状态. $("#id" ...

  7. Java/Android倒计时(开始,暂停,恢复,停止)

    由于要做暂停和恢复,这里我就没有使用Android的CountDownTimer,而是用了Java的Timer.所以,这个方法在java肯定是通用.我也外加了Android独有的Service,有些计 ...

  8. jquery判断滚动条是否到底部

    clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight ...

  9. EasyUI 创建Tree

    tree可以被从标记创建.easyui tree应该定义在ul元素中.无序列表ul元素提供了基本tree结构.每一个li元素被产生一个tree节点,子ul元素产生父tree节点.例子:     &lt ...

  10. Kali Linux学习笔记

    1. 重装grub 重装windows后MBR被覆盖导致linux无法启动,通过U盘进入live后执行以下命令: mount /dev/sda5 /mnt //此处是将linux系统根目录挂载到mnt ...