HarmonyOS ForEach中多层模型嵌套,更改数据不刷新问题

点击收藏取消收藏不刷新,ForumsModel是一个多层嵌套模型。

尝试以下方法都无用:

方法一:对数据源进行删除再添加操作,不起作用。

方法二:对数据源加入唯一索引字段,不起作用。

方法三:抽离listItem内容,单独组件。

HarmonyOS
17h前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
shlp

在上一版本demo中并未提供test定义,此次在在上一版本的基础上额外扩展一层,可以直接放入项目中测试,可以发现此版本中图像是可以响应变化的,与是否在ForEach中无关。但是如果按照写法将image组件修改为

Image(item.value>3?$r('app.media.forumCollected'):$r('app.media.forumCollect')) 

就可以发现,UI不会变化,根据log可知实际数值是变化了的,因此可知核心问题是Image组件不会响应item.value>3这一句判断。

@Observed
export class test{
  public name:string=""
  public value:number=0
  public isok:boolean=false
  constructor(name:string,value:number) {
    this.name=name
    this.value=value
    this.isok=this.value>3
  }
}
@Observed
export class testV2{
  public test:test[]=[]
  constructor() {
    this.test=[new test("测试",0),new test("测试1",1),new test("测试2",2),new test("测试3",3),new test("测试4",4),new test("测试5",5),new test("测试6",6),new test("测试7",7)]
  }
}
@Entry
@Component
struct Index{
  @State testList:testV2=new testV2()
  @State imageList:Resource[]=[]
  @State boolList:boolean[]=[false,false,false,false,false,false,false,false]
  aboutToAppear(): void {
    // this.testList=[new test("测试",0),new test("测试1",1),new test("测试2",2),new test("测试3",3),new test("测试4",4),new test("测试5",5),new test("测试6",6),new test("测试7",7)]
    this.imageList=[$r('app.media.forumCollected'),$r('app.media.forumCollected'),$r('app.media.forumCollected'),$r('app.media.forumCollected'),$r('app.media.forumCollect'),$r('app.media.forumCollect'),$r('app.media.forumCollect'),$r('app.media.forumCollect')]
  }
  build() {
    Column(){
      ForEach(this.testList.test,(item:test,index:number)=>{
        Column(){
          Text(item.name)
          Image(this.imageList[index]).width(20).height(20)
        }
        .onClick(()=>{
          item.value=item.value>3?item.value%3:item.value+3
          if(item.value>3){
            //todo 1 直接赋值,
            item.isok=true
            this.imageList[index]=$r('app.media.forumCollected')
          }
          else {
            item.isok=false
            this.imageList[index]=$r('app.media.forumCollect')
          }
          console.log(item.value+"看看")
        })
      })
      Column(){
        Text(this.testList.test[0].name)
        Image(this.imageList[0]).width(20).height(20)
      }
      .onClick(()=>{
        this.testList.test[0].value=this.testList.test[0].value>3?this.testList.test[0].value%3:this.testList.test[0].value+3
        this.testList.test[0].isok=this.testList.test[0].value>3
        if(this.testList.test[0].value>3){
          this.testList.test[0].isok=true
          this.imageList[0]=$r('app.media.forumCollected')
        }
        else {
          this.imageList[0]=$r('app.media.forumCollect')
          this.testList.test[0].isok=false
        }
        console.log(this.testList.test[0].value+"看看")
      })
    }
  }
}

至于ForEach的问题,参考开放文档可知@State装饰器不会响应深层次数组项子属性变化。而使用@ObjectLink装饰器则不可在定义时为对象赋值,可以尝试一下,在提供的demo中运行应该会出JsCrash的错误。参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-rendering-control-foreach-V5#%E6%95%B0%E6%8D%AE%E6%BA%90%E6%95%B0%E7%BB%84%E9%A1%B9%E5%8F%91%E7%94%9F%E5%8F%98%E5%8C%96

建议修改方式:在SubforumModel中添加一个类型为Resource字段,单独指向r('app.media.forumCollected')或者r('app.media.forumCollect'),之后在foreach中的Image组件直接调用该Resource类型属性即可。

分享
微博
QQ
微信
回复
15h前
相关问题
HarmonyOS ForEach列表刷新问题
83浏览 • 1回复 待解决
HarmonyOS ForEach创建的视图刷新问题
49浏览 • 1回复 待解决
HarmonyOS UI刷新问题
30浏览 • 1回复 待解决
HarmonyOS 数据刷新问题
103浏览 • 1回复 待解决
HarmonyOS 页面数据刷新问题
39浏览 • 1回复 待解决
HarmonyOS 装饰器刷新问题
235浏览 • 1回复 待解决
HarmonyOS swiper数据刷新问题
42浏览 • 1回复 待解决
修改ForEach使用的数据对象,UI刷新
1875浏览 • 1回复 待解决
HarmonyOS 状态变量刷新问题
518浏览 • 1回复 待解决
HarmonyOS 列表刷新问题
659浏览 • 1回复 待解决
HarmonyOS 组件刷新问题
81浏览 • 1回复 待解决
HarmonyOS 页面刷新问题
339浏览 • 1回复 待解决
HarmonyOS webview刷新问题
48浏览 • 2回复 待解决