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

目录

一、问题参数原因

二、解决方案


一、问题参数原因

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

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

二、解决方案

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

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

总结到此!

相关推荐
Dontla几秒前
打开网站时弹出Accept Cookies(接受Cookie)提示是什么意思?(数据保护法规,欧盟GDPR)
前端·数据库
2501_9445264219 分钟前
Flutter for OpenHarmony 万能游戏库App实战 - 关于页面实现
android·java·开发语言·javascript·python·flutter·游戏
壹号机长29 分钟前
canvas烟花特效各种前端框架都可以使用H5,vue,react,
vue.js·react.js·前端框架
咸鱼2.029 分钟前
【java入门到放弃】VUE部分知识点
java·javascript·vue.js
weixin_4896900235 分钟前
MicroSIP自定义web拨打协议
服务器·前端·windows
幻云20101 小时前
Python机器学习:筑基与实践
前端·人工智能·python
web小白成长日记1 小时前
Vue3中如何优雅实现支持多绑定变量和修饰符的双向绑定组件?姜姜好
前端·javascript·vue.js
晴天飛 雪1 小时前
Spring Boot 接口耗时统计
前端·windows·spring boot
摘星编程1 小时前
React Native鸿蒙版:Bluetooth扫描蓝牙设备
react native·react.js·harmonyos
0思必得01 小时前
[Web自动化] Selenium模拟用户的常见操作
前端·python·selenium·自动化