鸿蒙开发 数组改变,ui渲染没有刷新

问题描述:
数组push, 数组长度改变,ui也没有刷新

打印出了数组 console.log(this.toDoData.map(item => `${item.name}`).join(', '), this.toDoData.length)

原代码:

ts 复制代码
        Text('+')
          .fontSize(36)
          .margin({ right: 40 })
          .onClick(() => {
            TextPickerDialog.show({ // 文字选择弹窗
              range: this.availableThings,
              onAccept: (item:TextPickerResult) => {
                // 这里有点问题,数组新增 ui没有刷新
                let obj:ToDo = new ToDo(`${item.value}`)
                this.toDoData.push(obj)
                console.log(this.toDoData.map(item => `${item.name}`).join(', '), this.toDoData.length)
              }
            })
          })
        List({ space: 10 }){
          ForEach(this.toDoData, (toDoItem:ToDo) => {
            ListItem(){
              ToDoListItem({
                toDoItem: toDoItem,
              })
            }
          },(toDoItem: ToDo) => toDoItem.key.toString())
        }

这个问题和列表渲染的key有关系 ,也就是(toDoItem: ToDo) => toDoItem.key.toString()这段代码除了问题,这个key有可能重复,于是做了以下修改:

ts 复制代码
        List({ space: 10 }){
          ForEach(this.toDoData, (toDoItem:ToDo, i:number) => {
            ListItem(){
              ToDoListItem({
                toDoItem: toDoItem
              })
            }
          },
          	// 这里删除或者重新渲染key,使其不重复即可刷新列表
            // (toDoItem: ToDo) => toDoItem.key.toString()
            (i: number) => i.toString() 
          )
        }
相关推荐
qizayaoshuap4 分钟前
# [特殊字符] 指南针 — 鸿蒙ArkTS方向计算与方位跟踪系统
华为·harmonyos
达子66620 分钟前
第5章_图解harmonyos Ability基础知识
华为·harmonyos
国服第二切图仔22 分钟前
02-breakpoint-system
运维·harmonyos
Helen_cai35 分钟前
EntryAbility 全局初始化 + 网络请求 HttpUtil 完整源码
网络·华为·harmonyos
SuperHeroWu738 分钟前
【HarmonyOS AI】DevEco CLI、Skills、知识库运用AI Coding提效详解
人工智能·华为·harmonyos
熊猫钓鱼>_>1 小时前
ArkUI 动画实战:从理论到交互,构建流畅的鸿蒙动效体验
华为·架构·交互·harmonyos·arkts·arkui·native
Catrice01 小时前
HarmonyOS ArkTS 实战:实现一个校园宿舍电费查询与分摊应用
华为·harmonyos
2301_768103491 小时前
HarmonyOS趣味相机实战第31篇:图片文档List、详情弹层与删除状态闭环
list·harmonyos·arkts·状态管理·arkui
woshihuanglaoshi2 小时前
数据迁移与版本管理 - Flutter在鸿蒙平台实现数据库升级策略
数据库·学习·flutter·华为·harmonyos·鸿蒙·鸿蒙系统
爱写代码的阿木2 小时前
基于鸿蒙OS开发附近社交游戏平台(八)-聊天组件
华为·个人开发·harmonyos