[react] useState的一些小细节

1.无限循环

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

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


如果这样呢

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

2.异步修改数据

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

函数传参解决

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

Component – React 中文文档

改成这种形式

 

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

怎么拿最新结果 

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

可以用临时变量解决

 也可以套多一层函数形式

小细节

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

3.缓存功能

代码如下

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

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

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

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

相关文章

day 74 js

JS的作用&#xff1a; 修饰 HTML 标签&#xff08;CSS&#xff09;设置 HTML 标签的动作&#xff08;JS&#xff09;JS特点&#xff1a;基于对象的编程语言&#xff0c;通过浏览器解释执行作用&#xff1a;表单验证、改变标签样式、获取和设置标签属性值 1 表单验证: <fo…

抽象工厂模式:深入探索面向对象设计的多样性

在软件开发中&#xff0c;正确地应用设计模式对于构建可扩展、可维护和高效的系统至关重要。抽象工厂模式作为创建型设计模式之一&#xff0c;提供了一个高层接口&#xff0c;用于创建一系列相关或依赖对象&#xff0c;而无需指定它们具体的类。本文将详细介绍抽象工厂模式的概…

MyBatis源码介绍

文章目录 MyBatis的核心流程介绍SqlSessionFactory的理解MyBatis中的Executor的源码理解Spring中是如何解决MySQL的SqlSession的线程安全问题MyBatis面向Mapper编程工作原理Mybatis动态sql执行原理Mybatis的一级、二级缓存实现原理Mybatis的插件运行原理以及如何编写一个插件my…

【攻防世界】web2(逆向解密)

进入题目环境&#xff0c;查看页面信息&#xff1a; <?php $miwen"a1zLbgQsCESEIqRLwuQAyMwLyq2L5VwBxqGA3RQAyumZ0tmMvSGM2ZwB4tws";function encode($str){$_ostrrev($str);// echo $_o;for($_00;$_0<strlen($_o);$_0){$_csubstr($_o,$_0,1);$__ord($_c)1;…

排序之快速排序

代码 class Solution {public int[] sortArray(int[] nums) {merge(nums, 0, nums.length - 1);return nums;}private void merge(int[] nums, int l, int r){if(l > r) return;// 随机选取主元int i new Random().nextInt(r - l 1) l;int temp nums[i];nums[i] nums[…

【好用】推荐10套后端管理系统前端模板

后台管理系统前端模板是开发者在构建后台管理系统时使用的一种工具&#xff0c;它提供了预先设计好的界面和组件&#xff0c;以帮助开发者快速搭建出功能完善、用户体验良好的管理系统。以下是V哥整理的10款流行的后台管理系统前端模板&#xff0c;它们基于不同的技术栈和设计理…

第一部分 Vue讲解(代码版)

1.第一个vue实例 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" content"widthdevice-w…

要申请开通融资融券账户,有那些条件?

1、什么是融资融券交易? 融资融券交易&#xff0c;又称信用交易&#xff0c;是指投资者向具有融资融券业务资格的证券公司提供担 保物&#xff0c;借入资金买入交易所上市证券&#xff08;融资交易&#xff09;或借入交易所上市证券并卖出&#xff08;融券交易&#xff09; 的…

【vue】v-model.lazy等(非实时渲染)

v-model&#xff1a;实时渲染v-model.lazy&#xff1a;失去焦点/按回车后&#xff0c;才渲染v-model.number&#xff1a;值转换为数字v-model.trim&#xff1a;去除首尾空格 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8&qu…

ansible的常见用法

目录 ##编辑hosts文件 ##copy模块##复制过去 ##fetch模块##拉取 ##shell模块 ##好用 ##command模块## ##file模块### ##cron模块### ##crontab 计划任务 ##下载好时间插件 ##script模块 ##yum模块## ##yum下载源配置文件 /etc/yum.repos.d/CentOS-Base.repo ##ser…

【Java】第十五届蓝桥杯JavaB组第一道填空题

&#xff03;【Java】第十五届蓝桥杯JavaB组第一道填空题 大家好 我是寸铁&#x1f44a; 总结了一篇【Java】第十五届蓝桥杯JavaB组第一道填空题文章 喜欢的小伙伴可以点点关注 &#x1f49d; Java B组 第一道填空题题解如下:

大数据实训进行时:数据标注项目

数据标注项目 培训目的 让同学们先熟悉理论知识&#xff0c;如&#xff1a;识别障碍物是否满足拉框的要求&#xff0c;如何进行拉框&#xff1b;熟悉标注操作&#xff0c;培养出能够进入正式项目的人员 培训地点 理论&#xff1a;学术报告厅、阶梯教室 实操&#xff1a;1实…

性能优化-01

当看到性能指标时&#xff0c;你会首先想到什么呢&#xff1f;我相信 “高并发” 和 “响应快” 一定是最先出现在你脑海里的两个词&#xff0c;而它们也正对应着性能优化的两个核心指标—— “吞吐” 和 “延时” 。这两个指标是从应用负载的视角来考察性能&#xff0c;直接影…

SRNIC、选择性重传、伸缩性、连接扩展性、RoCEv2优化(六)

参考论文SRDMA&#xff08;A Scalable Architecture for RDMA NICs &#xff09;&#xff1a;https://download.csdn.net/download/zz2633105/89101822 借此&#xff0c;对论文内容总结、加以思考和额外猜想&#xff0c;如有侵权&#xff0c;请联系删除。 如有描述不当之处&…

【软考】哈希表

目录 一、概念1.1 定义 二、哈希函数的构造方法2.1 说明2.2 特性 三、处理冲突的方法3.1 说明3.2 开放定址法3.2.1 说明3.2.2 线性探测 3.3 链地址法3.4 再哈希法3.5 建立公共溢出区 四、哈希表的查找4.1 查找过程4.2 查找特点4.3 装填因子 一、概念 1.1 定义 1.一般存储结构由…

【回溯】Leetcode 51. N 皇后【困难】

N 皇后 按照国际象棋的规则&#xff0c;皇后可以攻击与之处在同一行或同一列或同一斜线上的棋子。 n 皇后问题 研究的是如何将 n 个皇后放置在 nn 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。 给你一个整数 n &#xff0c;返回所有不同的 n 皇后问题 的解决方案。…

android11 如何修改状态栏的背景

修改status_bar.xml &#xff1a; <LinearLayout android:id"id/status_bar_contents"android:background"#1ABC9C"android:layout_width"match_parent"android:layout_height"match_parent"android:paddingStart"dimen/statu…

chromium 协议栈 cronet ios 踩坑案例

1、请求未携带 Accept-Language http header 出现图片加载失败 现象&#xff1a; 访问 https://www.huawei.com/cn/?ic_mediumdirect&ic_sourcesurlent 时出现图片加载失败的问题 预期结果&#xff1a; 原因&#xff1a; 网络库删除了添加 Accept-Language header 的逻…

突破像素限制,尽显照片细腻之美——Topaz Gigapixel AI for Mac/Win

在这个数字化的时代&#xff0c;我们都热爱用照片记录生活中的美好瞬间。然而&#xff0c;有时候我们会发现&#xff0c;由于各种原因&#xff0c;照片的像素可能无法满足我们的需求。这时候&#xff0c;Topaz Gigapixel AI for Mac/Win 这款强大的照片放大工具应运而生。 Top…

智慧污水井物联网远程监控案例

智慧污水井物联网远程监控案例 在当今数字化转型的浪潮中&#xff0c;智慧水务已成为城市基础设施建设的重要组成部分。其中&#xff0c;基于物联网技术的智慧污水井远程监控系统以其高效、精准、实时的特性&#xff0c;在提升污水处理效能、保障城市水环境安全、实现精细化管…