HarmonyOS HashMap中放入数组,数组数据发生改变时如增加或者删除元素,如何触发UI刷新

定义一个HashMap:

@State allChannelsMaps: HashMap<string, Array<ChannelGroupDataChannelList>> = new HashMap();
UI布局如下:
List(){
          ForEach(this.channelTypeList, (channelData: ChannelTypeEntityData, index: number) =>{
            ListItem(){
              this.channelGrid(this.allChannelsMaps.get(channelData.channelType?.toString()),
                index,)
            }
          })
        }.width('100%')
.height('100%')
@Builder channelGrid(channelGroupData: Array<ChannelGroupDataChannelList>, index: number){
Grid(){
          ForEach(channelGroupData, (channel: ChannelGroupDataChannelList, index: number) =>{
            GridItem() {
              Text(channel.channelName)
                .fontSize((channel.channelName ?? '').length > 5 ? '11fp': '15fp')
                .fontColor($r('app.color.color202022'))
                .fontFamily(CommonConstants.SI_YUAN)
                .textAlign(TextAlign.Center)
                .width(this.itemWidth)
                .height(this.itemHeight)
                .backgroundColor($r('app.color.colorF9F9F9'))
                .borderRadius(4)
                .onClick(() =>{
                  const tapChannel: ChannelGroupDataChannelList = channelGroupData[index];
                  this.addChannelUpdateMap(tapChannel);
                })
            }
          })
        }
        .columnsTemplate('1fr 1fr 1fr 1fr')
        .columnsGap(10)
        .rowsGap(10)
        .height(this.channelTypeList[index].channelHeight)
        .nestedScroll({
          scrollForward: NestedScrollMode.PARENT_FIRST,
          scrollBackward: NestedScrollMode.SELF_FIRST
        })
}
HarmonyOS
2天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

参考以下demo:

import HashMap from '@ohos.util.HashMap'
class  DataItem {
  title:string;
  id:number
  constructor(title:string,id:number) {
    this.title = title;
    this.id = id
  }
}
@Entry
@Component
struct MapExample {
  @State hashMap: HashMap<string, Array<DataItem>>= new HashMap();
  @State keys:Array<string> =[ ]
  aboutToAppear(): void {
    this.hashMap.set("squirrel", [new DataItem("123",20)]);
    this.hashMap.set("sparrow", [new DataItem("human",45)]);
    this.keys = Array.from(this.hashMap.keys());
    console.info('valuesaaa',this.hashMap.values())
    for (let key of  this.keys) {
      console.log("key:" + key);
      console.log("value:" + this.hashMap.get(key));
    }
  }
  build(){
    List(){
      ForEach(this.keys , (item: string, index: number) =>{
        ChildItem({item:item})
      },(item:string)=>item)
    }
  }
}
@Component
struct ChildItem {
  @Prop item: string;
  build() {
    Text(this.item)
      .fontSize(50)
  }
}
分享
微博
QQ
微信
回复
2天前
相关问题
ForEach数组发生改变UI刷新
591浏览 • 1回复 待解决
数组元素变更如何触发刷新list?
392浏览 • 1回复 待解决
HarmonyOS 嵌套数组元素UI刷新方案
408浏览 • 1回复 待解决
readonly修饰的数组无法获取数组元素
2049浏览 • 1回复 待解决
如何删除数组中的空值?
373浏览 • 1回复 待解决
HarmonyOS 二维数组刷新问题
326浏览 • 1回复 待解决
class二次刷新渲染数组
744浏览 • 1回复 待解决