当前位置: 首页 > 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 …...

Java多线程实现之Callable接口深度解析

Java多线程实现之Callable接口深度解析 一、Callable接口概述1.1 接口定义1.2 与Runnable接口的对比1.3 Future接口与FutureTask类 二、Callable接口的基本使用方法2.1 传统方式实现Callable接口2.2 使用Lambda表达式简化Callable实现2.3 使用FutureTask类执行Callable任务 三、…...

【Go】3、Go语言进阶与依赖管理

前言 本系列文章参考自稀土掘金上的 【字节内部课】公开课&#xff0c;做自我学习总结整理。 Go语言并发编程 Go语言原生支持并发编程&#xff0c;它的核心机制是 Goroutine 协程、Channel 通道&#xff0c;并基于CSP&#xff08;Communicating Sequential Processes&#xff0…...

【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张(Windows/Linux)

要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况&#xff0c;可以通过以下几种方式模拟或触发&#xff1a; 1. 增加CPU负载 运行大量计算密集型任务&#xff0c;例如&#xff1a; 使用多线程循环执行复杂计算&#xff08;如数学运算、加密解密等&#xff09;。运行图…...

【Oracle】分区表

个人主页&#xff1a;Guiat 归属专栏&#xff1a;Oracle 文章目录 1. 分区表基础概述1.1 分区表的概念与优势1.2 分区类型概览1.3 分区表的工作原理 2. 范围分区 (RANGE Partitioning)2.1 基础范围分区2.1.1 按日期范围分区2.1.2 按数值范围分区 2.2 间隔分区 (INTERVAL Partit…...

C# 求圆面积的程序(Program to find area of a circle)

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

Mobile ALOHA全身模仿学习

一、题目 Mobile ALOHA&#xff1a;通过低成本全身远程操作学习双手移动操作 传统模仿学习&#xff08;Imitation Learning&#xff09;缺点&#xff1a;聚焦与桌面操作&#xff0c;缺乏通用任务所需的移动性和灵活性 本论文优点&#xff1a;&#xff08;1&#xff09;在ALOHA…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案&#xff1a;Java 字节码技术实战分享&#xff08;仅供学习&#xff09; 一、Aspose.PDF 简介二、说明&#xff08;⚠️仅供学习与研究使用&#xff09;三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...

保姆级教程:在无网络无显卡的Windows电脑的vscode本地部署deepseek

文章目录 1 前言2 部署流程2.1 准备工作2.2 Ollama2.2.1 使用有网络的电脑下载Ollama2.2.2 安装Ollama&#xff08;有网络的电脑&#xff09;2.2.3 安装Ollama&#xff08;无网络的电脑&#xff09;2.2.4 安装验证2.2.5 修改大模型安装位置2.2.6 下载Deepseek模型 2.3 将deepse…...

打手机检测算法AI智能分析网关V4守护公共/工业/医疗等多场景安全应用

一、方案背景​ 在现代生产与生活场景中&#xff0c;如工厂高危作业区、医院手术室、公共场景等&#xff0c;人员违规打手机的行为潜藏着巨大风险。传统依靠人工巡查的监管方式&#xff0c;存在效率低、覆盖面不足、判断主观性强等问题&#xff0c;难以满足对人员打手机行为精…...

PostgreSQL——环境搭建

一、Linux # 安装 PostgreSQL 15 仓库 sudo dnf install -y https://download.postgresql.org/pub/repos/yum/reporpms/EL-$(rpm -E %{rhel})-x86_64/pgdg-redhat-repo-latest.noarch.rpm# 安装之前先确认是否已经存在PostgreSQL rpm -qa | grep postgres# 如果存在&#xff0…...