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

react中修改state中的值无效?


// 初始化state
state = {personArr:[{name:'张三',id:1},{name:'李四',id:2},{name:'王五',id:3}]
}componentDidMount(){const newName = '赵六'const indexUpdate = 1const newArr = this.state.personArr.map((item,index)=>{if(indexUpdate === index){return {...item,name:newName}}else{return {...item}}})this.setState({personArr:newArr})console.log('personArr',this.state.personArr)
}

打印的值: 

问题来了,明明已经修改过了,为什么拿不到值呢,原来是setState的执行机制导致的,setState是作为异步来执行的,打印是同步的,因此拿不到值

解决: 要想获取更新后的值,只需在setState第二个参数中获取即可

this.setState({personArr:newArr
},()=>{console.log('personArr',this.state.personArr)
})

 打印结果:

 完美解决!

相关文章:

react中修改state中的值无效?

// 初始化state state {personArr:[{name:张三,id:1},{name:李四,id:2},{name:王五,id:3}] }componentDidMount(){const newName 赵六const indexUpdate 1const newArr this.state.personArr.map((item,index)>{if(indexUpdate index){return {...item,name:newName}}e…...

在Node.js中如何实现用户身份验证和授权

当涉及到构建安全的应用程序时,用户身份验证和授权是至关重要的一环。在Node.js中,我们可以利用一些流行的库和技术来实现这些功能,确保我们的应用程序具有所需的安全性。本篇博客将介绍如何在Node.js中实现用户身份验证和授权。 用户身份验…...

QT day2 2.21

1.使用手动连接,将登录框中的取消按钮使用qt4版本的连接到自定义的槽函数中,在自定义的槽函数中调用关闭函数 代码: #include "mywidget.h" #include "ui_mywidget.h"MyWidget::MyWidget(QWidget *parent): QWidget(pa…...

说说设备像素、css像素、设备独立像素、dpr、ppi 之间的区别

文章目录 一、背景二、介绍CSS像素设备像素设备独立像素dprppi 三、总结参考文献 一、背景 在css中我们通常使用px作为单位,在PC浏览器中css的1个像素都是对应着电脑屏幕的1个物理像素 这会造成一种错觉,我们会认为css中的像素就是设备的物理像素 但实…...

文生视频Sora

Sora:scalable diffusion models with transformers 文生视频模型 Sora:视频生成模型60s,视频中体现一定的物理逻辑 时空patch,是Sora创新的核心。 Sora 到底是不是物理引擎甚至世界模型?数据驱动的物理引擎 帆船在水里…...

汽车常识网:电脑主机如何算功率的计算方法?

今天汽车知识网就给大家讲解一下如何计算一台主机的功率。 它还会解释如何计算计算机主机所需的功率? ? (如何计算电脑主机所需的功率)进行说明。 如果它恰好解决了您现在面临的问题,请不要忘记关注本站。 让我们现在就…...

c语言常见操作符及操作符优先级

目录 概述1. 算术操作符:2. 关系操作符:3. 逻辑操作符:4. 位操作符: *常见操作符优先级* 概述 C语言中有多种操作符,用于执行不同的操作。下面是一些常见的C语言操作符以及示例代码: 1. 算术操作符&…...

IO进程线程:通信

1.定义互斥锁 #include<myhead.h>int num520;//临界资源//1.创建一个互斥锁变量 pthread_mutex_t mutex;//定义任务&#xff11;函数 void *task1(void *arg) {printf("11111111111111\n");//3.获取锁资源pthread_mutex_lock(&mutex);num1314;sleep(3);pr…...

神经网络系列---常用梯度下降算法

文章目录 常用梯度下降算法随机梯度下降&#xff08;Stochastic Gradient Descent&#xff0c;SGD&#xff09;&#xff1a;随机梯度下降数学公式&#xff1a;代码演示 批量梯度下降&#xff08;Batch Gradient Descent&#xff09;批量梯度下降数学公式&#xff1a;代码演示 小…...

Flink 的历史版本特性介绍(一)

如果你还不了解 Flink 是什么,可以查看我之前的介绍文章:Flink 介绍 如果你想跟着我一起学习 flink,欢迎查看订阅专栏:Flink 专栏 这篇文章列举了 Flink 每次发布的版本中的重要特性,从中可以看出 Flink 是如何一步一步发展到今天的。 Flink 的前身是 Stratosphere 项目…...

【尚硅谷】MybatisPlus 学习笔记(下)

目录 六、插件 6.1、分页插件 6.1.1、添加配置类 6.1.2、测试 6.2、xml自定义分页 6.2.1、UserMapper中定义接口方法 6.2.2、UserMapper.xml中编写SQL 6.2.3、测试 6.3、乐观锁 6.3.1、场景 6.3.2、乐观锁与悲观锁 6.3.3、模拟修改冲突 数据库中增加商品表 添加数…...

408数据结构算法模板

下面这份408数据结构算法模板耗时3天整理&#xff0c;希望对大家有用 408算法题概述 得分要点 会写结构定义&#xff08;没有就自己写上&#xff09;写清楚解题的算法思想描述清楚算法实现最后写出时间和空间复杂度 关于改卷 1、改卷老师不会上机试 2、老师改的是扫描卷 3、…...

Mysql--索引分类

Mysql--索引分类 1. 索引分类2. 聚集索引&二级索引 1. 索引分类 在MySQL数据库&#xff0c;将索引的具体类型主要分为以下几类&#xff1a;主键索引、唯一索引、常规索引、全文索引。 2. 聚集索引&二级索引 而在在InnoDB存储引擎中&#xff0c;根据索引的存储形式&am…...

AutoTimes:通过大语言模型的自回归时间序列预测器

论文标题&#xff1a; AutoTimes: Autoregressive Time Series Forecasters via Large Language Models 作者&#xff1a;Yong Liu, Guo Qin, Xiangdong Huang, Jianmin Wang, Mingsheng Long 链接&#xff1a;https://arxiv.org/abs/2402.02370 机构&#xff1a;清华大学 …...

记录 | go与C/C++交互

Go语言是类C的语言&#xff0c;与C语言有着千丝万缕的联系&#xff0c;在Go语言的代码中可以直接调用C语言代码&#xff0c;但不支持直接调用 C。 Go 调用 C/C 的方式&#xff1a; C&#xff1a;直接调用 C API&#xff1b;C&#xff1a;通过实现一层封装的 C 接口来调用 C 接…...

B3623枚举排列

题目描述 今有 n 名学生&#xff0c;要从中选出 k 人排成一列拍照。 请按字典序输出所有可能的排列方式。 输入格式 仅一行&#xff0c;两个正整数 n,k。 输出格式 若干行&#xff0c;每行 k 个正整数&#xff0c;表示一种可能的队伍顺序。 输入输出样例 输入 #1复制 …...

vuex怎么防止数据刷新丢失?

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式和库。它采用集中式存储管理应用的所有组件的状态&#xff0c;并以相应的规则保证状态以一种可预测的方式发生变化。为了防止 Vuex 中的数据在刷新时丢失&#xff0c;你可以采取以下策略&#xff1a; 持久化插件&#xff1a…...

OpenGL ES 渲染 NV21、NV12、I420、YV12、YUYV、UYVY、I444(建议收藏)

本文主要讲解常见的 YUV 格式图像渲染方式,如果对 YUV 格式不是很熟悉的同学可以翻看旧文一文掌握 YUV 图像的基本处理,YUV 格式的介绍这里不再展开。 渲染 NV21、NV12 格式图像 NV21、NV12 可以看成同一种结构,区别只是 uv 的交错排列顺序不同。 渲染 NV21/NV12 格式图像…...

云计算的两地三中心和灾备介绍

两地三中心是指在不同的地理位置建立两个数据中心和一个灾备中心&#xff0c;其中一个数据中心为主数据中心&#xff0c;另一个数据中心为备用数据中心&#xff0c;灾备中心则用于备份数据和在主数据中心或备用数据中心发生故障或灾难时提供应急支持。 异地灾备则是指在不同的地…...

Spring Bean

Spring的配置方式 1、xml配置文件 2、基于注解的方式 3、基于Java的方式 Spring Bean的生命周期 1、通过构造器或工厂方法创建bean实例 2、为bean的属性赋值 3、调用bean的初始化方法 4、使用bean 5、当容器关闭时&#xff0c;调用bean的销毁方法 Spring inner beans …...

DiffBIR实战:用Stable Diffusion 2.1修复模糊老照片(附完整配置流程)

DiffBIR实战&#xff1a;用Stable Diffusion 2.1修复模糊老照片&#xff08;附完整配置流程&#xff09; 翻开泛黄的相册&#xff0c;那些承载着珍贵记忆的老照片往往因年代久远而变得模糊、褪色甚至破损。传统修复方法需要专业设计师耗费数小时手动修复&#xff0c;而如今&…...

PCB板验证

铺铜完成是PCB设计中的一个重要里程碑&#xff0c;但还不是终点。在发送给板厂生产之前&#xff0c;还需要完成一系列关键的验证、优化和文件输出工作。简单来说&#xff0c;铺铜之后的标准流程是&#xff1a;设计验证&#xff08;DRC/DFM&#xff09; → 必要分析&#xff08;…...

从硬编码到动态定义:Qlib表达式引擎如何重构量化因子开发范式

从硬编码到动态定义&#xff1a;Qlib表达式引擎如何重构量化因子开发范式 【免费下载链接】qlib Qlib 是一个面向人工智能的量化投资平台&#xff0c;其目标是通过在量化投资中运用AI技术来发掘潜力、赋能研究并创造价值&#xff0c;从探索投资策略到实现产品化部署。该平台支持…...

WindowsCleaner深度解析:如何用开源工具轻松解决C盘空间不足问题

WindowsCleaner深度解析&#xff1a;如何用开源工具轻松解决C盘空间不足问题 【免费下载链接】WindowsCleaner Windows Cleaner——专治C盘爆红及各种不服&#xff01; 项目地址: https://gitcode.com/gh_mirrors/wi/WindowsCleaner 你是否经常遇到C盘空间不足的困扰&am…...

Obsidian模板库实战指南:从零构建高效知识管理系统

Obsidian模板库实战指南&#xff1a;从零构建高效知识管理系统 【免费下载链接】OB_Template OB_Templates is a Obsidian reference for note templates focused on new users of the application using only core plugins. 项目地址: https://gitcode.com/gh_mirrors/ob/OB…...

YOLOv9镜像实测:无需配置环境,快速实现目标检测全流程

YOLOv9镜像实测&#xff1a;无需配置环境&#xff0c;快速实现目标检测全流程 1. 开箱即用的YOLOv9体验 对于目标检测开发者来说&#xff0c;最头疼的往往不是算法本身&#xff0c;而是环境配置这个"拦路虎"。不同版本的CUDA、PyTorch、Python之间的兼容性问题&…...

别再死记硬背了!用Multisim仿真带你玩转计数器与数据选择器(附FPGA引脚配置)

用Multisim仿真与FPGA实战&#xff1a;计数器与数据选择器的设计艺术 数字电路课程中那些抽象的概念&#xff0c;是否曾让你感到困惑&#xff1f;模5计数器、序列信号发生器这些名词听起来高深莫测&#xff0c;但通过Multisim仿真和FPGA实战&#xff0c;你会发现它们其实可以很…...

Arduino库管理终极指南:在VS Code中如何优雅添加自定义头文件(避坑版)

Arduino库管理终极指南&#xff1a;在VS Code中优雅添加自定义头文件 第一次在VS Code里看到"fatal error: my_library.h: No such file or directory"的红色报错时&#xff0c;我盯着屏幕发了五分钟呆。作为从Arduino IDE转战VS Code的老玩家&#xff0c;本以为能无…...

Docker 安装 Portainer(Docker 容器管理工具)

安装步骤 1. 创建 Portainer 数据卷&#xff08;可选&#xff0c;用于持久化数据&#xff09; docker volume create portainer_data2. 运行 Portainer 容器 方式一&#xff1a;Docker 命令运行 docker run -d \-p 8000:8000 \-p 9443:9443 \--name portainer \--restartalways…...

ParrelSync跨平台终极指南:Windows、macOS和Linux完整配置教程

ParrelSync跨平台终极指南&#xff1a;Windows、macOS和Linux完整配置教程 【免费下载链接】ParrelSync (Unity3D) Test multiplayer without building 项目地址: https://gitcode.com/gh_mirrors/pa/ParrelSync ParrelSync是一款专为Unity3D开发者设计的高效工具&#…...