arkts列表渲染只能渲染一条数据

83 阅读1分钟

如下图,我的变量是一个数组类型,存在多条值的,但是无论变量里面的值怎么发生变化,渲染出来的数据都还是一条。

此时的代码如下,无论的我的数组发生什么变化,都是只渲染一条数据

//定义的变量
@State data:any = []
 
 
//UI代码
List() {
  ListItem() {
    Row() {
      Image('static/icon/rt.png').width(45).margin({ top: 10, bottom: 10, right: 10, left: 0 })
       Text('返回上一层').fontSize(18)
    }.cell()
  }
 
  ForEach(this.data, (itemValue: any) => {
    ListItem() {
      DeptItem({ item: itemValue }).onClick(() => {
        this.DeptItemChange(itemValue)
      })
    }
 
 
 
   }, (item: any) => item)
}.margin({bottom:70})

解决方法如下,需要在ForEach循环时设置一个每个子项的key值,这样才可以正常渲染

ForEach(this.data, (itemValue: any) => {
       ListItem() {
           DeptItem({ item: itemValue }).onClick(() => {
               this.DeptItemChange(itemValue)
           })
       }
 
//在这里需要给每个子项设置一个key值,并且保证key值存在,我这个数组比较特殊,只能用index来设置key值
}, (item: any,index:number) => index.toString())

结果如图: