首页 > 其他分享 >setsate更新之后和usestate的区别

setsate更新之后和usestate的区别

时间:2024-05-09 15:05:45浏览次数:22  
标签:count 异步 setCount 更新 state usestate setsate setState

1 setsate
setState( updater [,callback] )
updater:object/function - 用于更新数据
callback:function - 用于获取更新后最新的 state 值

a 构造函数是唯一建议给 this.state 赋值的地方
b 不建议直接修改 state 的值,因为这样不会重新渲染组件
c 自动进行浅合并(只会合并第1层)
d 由于 setState() 异步更新的缘故,依赖 state 旧值更新 state 的时候建议采用传入函数的方式

setState() 异步更新(最好的方法是获取到多个更新, 之后进行批量更新,提高性能)

2 setState一定是异步的吗?
答: 其实可以分成两种情况
在组件生命周期或React合成事件中, setState是异步的
在setTimeou或原生DOM事件中, setState是同步的

3 usestate
const [ state , setState ] = useState( initVal )
调用 setState() 后组件不会立刻更新,无法立刻获取到最新的 state 值
const [count, setCount] = useState(1);
setCount(count + 1);
console.log(count) //setCount()后直接打印出的是旧数据

解决办法:由于useState()获取的setState()不支持第2个参数,可以通过useEffect来解决此问题
useEffect(() => {
console.log(count);
}, [count]);

4 setState和repalceState的区别
setState 是修改其中的部分状态,相当于 Object. assign,只是覆盖,不会减少原来的状态;
replaceState 是完全替换原来的状态,相当于赋值,将原来的 state 替换为另一个对象,如果新状态属性减少,那么 state 中就没有这个状态了

标签:count,异步,setCount,更新,state,usestate,setsate,setState
From: https://www.cnblogs.com/zw100655/p/18182247

相关文章

  • Apache DolphinScheduler 3.3.0 版本重磅更新提前看!
    ApacheDolphinScheduler3.3.0版本终于要在万众期待中发布啦!本次发版将有重大功能更新,包括架构上的调整。为了让广大用户提前尝鲜,社区特别准备了直播活动提前揭秘3.3.0版本中的重要更新,到时候你将会了解到这些信息:3.3.0版本的工作流引擎改进任务执行流程的优化架构模块上的......
  • idrac9更新BIOS固件
    1.登陆IDRAC管理界面,菜单栏选择维护->系统更新2.在系统更新界面选择手动更新,位置类型选择本地并点击浏览选择升级的BIOS文件3.找到BIOS文件所在的路径,选择需要升级的BIOS文件并打开4.点击上载5.勾选已上载的文件后,选择安装并重启6.提示信息:正在更新作业队列。可点击作业队列查看进......
  • 没有查询、插入、更新、删除权限
    2024-05-0815:22:23报错原文cmdTransaction:TheINSERTpermissionwasdeniedontheobject'tb_Vendor_CocImgs',database'QSIDB',schema'dbo'.TheINSERTpermissionwasdeniedontheobject'tb_Vendor_CocImgs',databa......
  • react中的state值修改了,也触发了页面的重新渲染,但是视图没有更新,可能是什么原因?
    state更新的是一个值List,但是页面渲染使用的是List中的某一项(当前选中项curItem),也定义成了state,而更新状态时,只更新了List,忽视了当前选中项curItem的状态更新,导致视图没有更新,即使组件重新渲染了,但是视图中使用的是curItem解决方案:state中不要保存当前选中项curItem,而应该保......
  • 末路狂花钱迅雷BT完整下载[1.12GB/2.35GB/Mp4]4K高清[1080P已更新]
    《末路狂花钱》是一部由导演马丁·斯科塞斯执导,1987年上映的经典电影。该片以真实的故事为基础,讲述了华尔街投资银行的故事,深入揭示了贪婪、欲望和腐败在当时华尔街的蔓延。本文将从电影的拍摄背景、故事情节以及对当时时代的反映与现实意义等方面进行分析。 首先,......
  • 九龙城寨之围城下载/迅雷BT[HD-1280P/2.21GB/MP4中字]4k中字已更新
    《九龙城寨之围城》是一部以真实历史事件为背景的电影,讲述了1967年香港发生的九龙城寨事件。该片通过精彩的剧情、真实的场景和生动的角色,再现了当时发生的种种困境与挑战。影片不仅展示了九龙城寨的社会环境和居民生活,更呈现了人性的复杂与光辉。 电影以九龙城寨......
  • docker-compose+nginx实现服务不中断更新
    思路是写一个脚本,docker-composescale扩容,然后重写nginx配置文件,刷新负载均衡nginx重写的配置文件,文件名service,里面只有upstream,例如:upstreame-chatbot-server-dev{server0.0.0.0:8080;server0.0.0.0:8081;}脚本使用方法:./rollupdate.sh--service=test-serve......
  • mysql 的常用批量更新
    批量更新inupdatetableNamesetcolumnName=valuewherecolumnNamein(value1,value2,value3);有局限性,限制了更新的属性值必须一致。如果不一致,需要分开写多个update语句。insertinto...onduplicatekeyupdateinsertintotableName(columnName1,columnName2)......
  • 在 Apple silicon Mac 上 DFU 模式修复或恢复 macOS 固件 (2024年5月更新)
    在ApplesiliconMac上DFU模式修复或恢复macOS固件搭载Apple芯片的Mac电脑DFU模式全新安装macOSSonoma请访问原文链接:在ApplesiliconMac上DFU模式修复或恢复macOS固件,查看最新版。原创作品,转载请保留出处。作者主页:sysin.orgMaccomputerswithApple......
  • Mac更新python3.12 解决pip3安装报错
    Mac使用homebrew更新了python3.12,删除了以前的版本和pip3安装软件时候报错。error:externally-managed-environment×Thisenvironmentisexternallymanaged╰─>ToinstallPythonpackagessystem-wide,trybrewinstallxyz,wherexyzisthepackageyouare......