鸿蒙开发 数组改变,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() 
          )
        }
相关推荐
●VON4 小时前
在鸿蒙 PC 上使用 Electron 获取本机 IP 地址
tcp/ip·electron·harmonyos
汉堡黄5 小时前
鸿蒙开发:案例集合Tabs:tabs竖向粘性
harmonyos
威哥爱编程5 小时前
【鸿蒙开发实战篇】如何基于一多能力实现响应式布局
harmonyos·arkts·arkui
威哥爱编程5 小时前
【鸿蒙开发实战篇】如何实现高级图片滤镜
harmonyos·arkts·arkui
威哥爱编程5 小时前
【鸿蒙开发实战篇】强大的跨应用数据分享与应用内文件共享
harmonyos·arkts·arkui
威哥爱编程5 小时前
【鸿蒙开发实战篇】如何利用 3D渲染引擎实现高性能动态滤镜特效
harmonyos·arkts·arkui
威哥爱编程6 小时前
【鸿蒙开发实战篇】滤镜效果图高效分享
harmonyos·arkts·arkui
S***q1926 小时前
HarmonyOS应用沙盒机制
华为·harmonyos
威哥爱编程6 小时前
【鸿蒙开发实战篇】鸿蒙6.0图片编辑实战:PixelMap与Canvas的完美结合
harmonyos
威哥爱编程6 小时前
【鸿蒙开发实战篇】鸿蒙跨设备的碰一碰文件分享
harmonyos·arkts·arkui