[react] useState的一些小细节

1.无限循环

因为setState修改是异步的,加上会触发函数重新渲染, 如果代码长这样

 一秒再修改,然后重新触发setTImeout, 然后再触发,重复触发循环


如果这样呢

还是会,因为你执行又会重新渲染 

2.异步修改数据

为什么修改多次还是跟不上呢?

函数传参解决

因为是异步修改 ,所以会出现问题,怎么办?用传函数的形式解决

Component – React 中文文档

改成这种形式

 

用回调的方式返回上一个state的值,这样就可以解决了,当然可以简洁些

怎么拿最新结果 

但是最后那个打印还是拿不到最新的结果咋办?

可以用临时变量解决

 也可以套多一层函数形式

小细节

这里数据加了几次,但是只渲染一次,把你要更新的请求合并到一起处理

3.缓存功能

代码如下

每次点击x,y都会加1,但是

为什么?因为每次组件重新渲染let y都会重新赋值!!setState有缓存不会重新赋值 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/815960.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Nacos 入门篇---服务端如何处理客户端的服务注册请求?(三)

一、引言 ok呀,上个章节我们讲了Nacos客户端的服务自动注册,今天我们来看看服务端接收到了客户端的服务注册请求,服务端都做了哪些事情~ 二、目录 目录 一、引言 二、目录 三、回顾上节内容: 四、Nacos 服务代码入…

Springboot整合nacos报错无法连接nacos

报错信息:Nacos com.alibaba.nacos.api.exception.NacosException: Client not connected, current status:STARTING 关于这个报错的原因有很多:如Nacos未启动、网络问题、配置问题、版本不兼容问题等,我的报错原因主要是版本不兼容。 下面…

5.9 mybatis之callSettersOnNulls作用

文章目录 1. 当callSettersOnNullstrue时2. 当callSettersOnNullsfalse时 在mybatis的settings配置参数中有个callSettersOnNulls参数,官方解释为:指定当结果集中值为 null 的时候是否调用映射对象的 setter(map 对象时为 put)方法…

PostgreSQL入门到实战-第三十弹

PostgreSQL入门到实战 PostgreSQL教程网站官网地址PostgreSQL概述更新计划 PostgreSQL教程网站 https://www.postgresqltutorial.com/ 官网地址 声明: 由于操作系统, 版本更新等原因, 文章所列内容不一定100%复现, 还要以官方信息为准 https://www.postgresql.org/PostgreS…

【系统分析师】计算机网络

文章目录 1、TCP/IP协议族1.1 DHCP协议1.2 DNS协议1.3网络故障诊断 2、网路规划与设计2.1逻辑网络设计2.2物理网络设计2.3 分层设计 3、网络接入3.1 接入方式3.2 IPv6地址 4、综合布线技术5、物联网5.1物联网概念与分层5.2 物联网关键技术 6、云计算7、网络存储技术&#xff08…

neo4j使用详解(结尾、neo4j的java driver使用模板及工具类——<可用于生产>)

Neo4j系列导航: neo4j安装及简单实践 cypher语法基础 cypher插入语法 cypher插入语法 cypher查询语法 cypher通用语法 cypher函数语法 neo4j索引及调优 neo4j java Driver等更多 1. 简介 本文主要是java使用neo4j driver操作neo4j的模板项目及非常有用的工具类,主要包括: 图…

Vector - CAPL - XCP介绍_02

前面我们介绍了关于使用vector XCP License后,通过CAPL对XCP协议进行连接、断开和获取当前XCP连接状态的函数,本篇文章不做过多的其他赘述,我们继续介绍CAPL控制XCP相关的其他函数。 目录 xcpActivate 代码示例 xcpDeactivate xcpActiva…

LeetCode617:合并二叉树

题目描述 给你两棵二叉树: root1 和 root2 。 想象一下,当你将其中一棵覆盖到另一棵之上时,两棵树上的一些节点将会重叠(而另一些不会)。你需要将这两棵树合并成一棵新二叉树。合并的规则是:如果两个节点重…

8:系统开发基础--8.1:软件工程概述、8.2:软件开发方法 、8.3:软件开发模型、8.4:系统分析

转上一节: http://t.csdnimg.cn/G7lfmhttp://t.csdnimg.cn/G7lfm 课程内容提要: 8:知识点考点详解 8.1:软件工程概述 1.软件的生存周期 2.软件过程改进—CMM Capability Maturity Model能力成熟度模型 3.软件过程改进—CMMI—…

vmware安装win10及ubuntu

安装win10 新建一个文件夹 选择刚才创建的文件夹 选择需要保存文件的位置,还是选择刚才创建的文件夹 选择自定义硬件 选择下载的win10镜像iso文件,导入后,点击完成即可 接下来就是下一步 没有此电脑,可以点击个性化-》主题-》桌面设置…

SecureCRT日志记录的7个经典配置记录与14个环境变量(%Y-%M-%D_%H_%S_session.log %t )

每次更换电脑、主机或者环境都需要配置一遍SecureCRT的参数。感觉就最近十年都已经设置过上百次了。其实设置没什么特别的,只是经过不断地打磨,主打的就是一个经济实用。经常忘记,特此记录。 配置方式 建议直接配置默认session:…

Centos安装MySQL提示公钥尚未安装

一、问题 在Centos7.9使用yum安装MySQL时出现错误,提示:mysql-community-server-5.7.44-1.el7.x86_64.rpm 的公钥尚未安装,如下图所示: 执行命令:systemctl start mysqld也提示错误:Failed to start mysq…

Spark-机器学习(1)什么是机器学习与MLlib算法库的认识

从这一系列开始,我会带着大家一起了解我们的机器学习,了解我们spark机器学习中的MLIib算法库,知道它大概的模型,熟悉并认识它。同时,本篇文章为个人spark免费专栏的系列文章,有兴趣的可以收藏关注一下&…

如何在Windows安装LocalSend并结合内网穿透实现公网跨平台远程文件互传

文章目录 1. 在Windows上安装LocalSend2. 安装Cpolar内网穿透3. 公网访问LocalSend4. 固定LocalSend公网地址 本篇文章介绍在Windows中部署开源免费文件传输工具——LocalSend,并且结合cpolar内网穿透实现公网远程下载传输文件。 localsend是一款基于局域网的文件传…

链表-双指针-虚拟节点-力扣

链表--双指针--虚拟节点 力扣 142 环形链表求循环起点 重点力扣 21 合并两个有序链表力扣 86 分割链表力扣23 合并K个有序链表 -- 优先队列(二叉堆 小顶堆)重点力扣19 找倒数第N个元素 快慢指针 一次遍历 重点力扣876 快慢指针找中间节点力扣 160 相交链…

【C++】模板初阶——泛型编程、函数模板、类模板

1. 泛型编程 如何实现一个通用的交换函数呢? void Swap(int& left, int& right) {int temp left;left right;right temp; } void Swap(double& left, double& right) {double temp left;left right;right temp; } void Swap(char& left…

系统思考—时间滞延

“没有足够的时间是所有管理问题的一部分。”——彼得德鲁克 鱼和熊掌可以兼得,但并不能同时获得。在提出系统解决方案时,我们必须认识到并考虑到解决方案的实施通常会有必要的时间滞延。这种延迟有时比我们预想的要长得多,特别是当方案涉及…

2024年大唐杯备考

努力更新中…… 第一章 网络架构和组网部署 1.1 5G的网络整体架构 5G网络中的中传、回传、前传(这里属于承载网的概念) CU和DU之间是中传 BBU和5GC之间是回传 BBU和AAU之间是前传(这个好记) 这里竟然还藏了MEC(…

前端大屏适配几种方案

一、方案一:remfont-size 动态设置HTML根字体大小和body字体大小,会使用到lib-flexible.js插件lib-flexible.js (function flexible(window, document) {var docEl document.documentElementvar dpr window.devicePixelRatio || 1// adjust body font…

Element-UI 自定义-下拉框选择年份

1.实现效果 场景表达&#xff1a; 默认展示当年的年份&#xff0c;默认展示前7年的年份 2.实现思路 创建一个新的Vue组件。 使用<select>元素和v-for指令来渲染年份下拉列表。 使用v-model来绑定选中的年份值。 3.实现代码展示 <template><div><el-…