前端 React useState 数组或对象改变后页面没有更新渲染解决

目录

一、问题参数原因

二、解决方案


一、问题参数原因

当数组或对象的原本地址没有发生改变时,页面不会检测到数据更新,下面是有问题的写法:

javascript 复制代码
 const [care, setCare] = useState<boolean[]>([])
 care[index] = true
 setCare(care)  //这种写法的源地址不会发生变化,导致页面不能检测到地址变化

二、解决方案

可以通过解构数组或对象的形式来更新数据地址:

javascript 复制代码
care[index] = true
setCare([...care])  //解构重构后地址刷新,页面渲染刷新,对象类型也类似

总结到此!

相关推荐
终端鹿8 分钟前
Vue2 迁移 Vue3 避坑指南
前端·javascript·vue.js
进击的尘埃12 分钟前
Signals 跨框架收敛:TC39 提案、Solid、Angular、Preact 的实现差异与调度策略对比
javascript
程序员陆业聪13 分钟前
工程师的瓶颈,已经不是代码了
前端
毛骗导演29 分钟前
@tencent-weixin/openclaw-weixin 源码ContextToken 持久化改造:实现微信自定义消息发送能力
前端·架构
爱丽_29 分钟前
Pinia 状态管理:模块化、持久化与“权限联动”落地
java·前端·spring
进击的尘埃38 分钟前
从多仓到 Monorepo 的渐进式迁移:Git 历史保留、依赖收敛与缓存调优
javascript
SuperEugene1 小时前
TypeScript+Vue 实战:告别 any 滥用,统一接口 / Props / 表单类型,实现类型安全|编码语法规范篇
开发语言·前端·javascript·vue.js·安全·typescript
我是永恒1 小时前
上架一个跨境工具导航网站
前端
电子羊1 小时前
Spec 编程工作流文档
前端
GISer_Jing2 小时前
从CLI到GUI桌面应用——前端工程化进阶之路
前端·人工智能·aigc·交互