鸿蒙开发 数组改变,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() 
          )
        }
相关推荐
zhanshuo3 小时前
在鸿蒙里优雅地处理网络错误:从 Demo 到实战案例
harmonyos
zhanshuo3 小时前
在鸿蒙中实现深色/浅色模式切换:从原理到可运行 Demo
harmonyos
whysqwhw8 小时前
鸿蒙分布式投屏
harmonyos
whysqwhw9 小时前
鸿蒙AVSession Kit
harmonyos
whysqwhw11 小时前
鸿蒙各种生命周期
harmonyos
whysqwhw12 小时前
鸿蒙音频编码
harmonyos
whysqwhw12 小时前
鸿蒙音频解码
harmonyos
whysqwhw12 小时前
鸿蒙视频解码
harmonyos
whysqwhw12 小时前
鸿蒙视频编码
harmonyos
ajassi200012 小时前
开源 Arkts 鸿蒙应用 开发(十八)通讯--Ble低功耗蓝牙服务器
华为·开源·harmonyos