HarmonyOS @Watch回调方法没有改变

父组件:

 @State arrLessonTab:LessonTab[] = []

子组件 :

@Prop @Watch('onLessonTabUpdate') arrLessonTab:LessonTab[] = []
onLessonTabUpdate(changedPropertyName: string) {
}

arrLessonTab通过接口获取后,子组件Watch的回调方法onLessonTabUpdate没有任何反应。使用boolean类型的变量进行尝试也没有反应。

HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

监听数组里的变化,参考示例如下,需要下载一个三方库 :

ohpm install class-transformer
import { plainToClass, ClassConstructor } from "class-transformer"
import { BusinessError, request } from '@kit.BasicServicesKit';

@Observed
class ProductModel {
  name: string = ''
  count: number = 0;
}

@Entry
@Component
struct ProductListView {
  //todo 1 父组件同步子组件needFreshCount值变化,在监听事件中增加业务逻辑处理
  @State @Watch('productListChanged') needFreshCount: number = 0;
  @State needFreshCount2: number = 0;
  jsonString: string = '[{"name":"商品1", "count":"1"},{"name":"商品2", "count":"1"},{"name":"商品3", "count":"1"}]'
  @State productList: ProductModel[] = [];

  productListChanged() {
    this.needFreshCount2++;
    console.log('needFreshCount2' + `${this.needFreshCount2}`)
  }

  aboutToAppear(): void {
    this.productList = jsonToArray(ProductModel, this.jsonString);
  }

  build() {
    Column({ space: 10 }) {
      Text('父组件这里没有刷新/或只刷新一次__' + `${this.needFreshCount2}`)
      ForEach(this.productList, (item: ProductModel, index: number) => {
        Column() {
          //todo 2 Watch监听不到数组中对象属性值变化,needFreshCount
          ProductView({
            item: item,
            needFreshCount: this.needFreshCount,
            countChanged: (product) => {
              //productList数组中嵌套对象item的属性值发生变化,监听不到数组的变化,无法触发productListChanged()这个监听方法
              // 这里即使把下面这行代码注释打开,给数组重新赋值,productListChanged()方法也只调用一次,并且影响子组件都只能更新一次了
              // this.productList[index] = product;
              // 上面的那种元素赋值不行,下面的这种整个数组赋值也依然不行
              // let temp = this.productList;
              // temp[index] = product;
              // this.productList = temp;
            }
          })
          Child2({ needFreshCount: this.needFreshCount, productList: this.productList })
            .margin({ top: 50 });


        }
      })
    }
  }
}

@Component
struct ProductView {
  @ObjectLink @Watch('productChanged') item: ProductModel;
  @Link needFreshCount: number;

  productChanged() {
    //todo 3 监听productList 数组中某个对象属性值发生变化,与父组件绑定一个变量needFreshCount,在父组件中监听needFreshCount变化
    this.needFreshCount++;
    console.log('ProductView' + `${this.needFreshCount}`)
  }

  countChanged: (item: ProductModel) => void = () => {
  };

  build() {
    Row() {
      Text(this.item.name)
      Text(`${this.item.count}`)
      Button('数量-1').onClick(() => {
        this.item.count--
        if (this.countChanged !== undefined) {
          this.countChanged(this.item);
        }
      })
      Button('数量+1').onClick(() => {
        this.item.count++
        if (this.countChanged !== undefined) {
          this.countChanged(this.item);
        }
      })
    }.width('100%').justifyContent(FlexAlign.SpaceBetween)
  }
}

@Component
struct Child2 {
  @Link @Watch('productChanged') needFreshCount: number;
  @State childNeedFreshCount: number = 0;
  @Prop productList: ProductModel[];

  productChanged() { //todo 4 监听 needFreshCount,同步父组件变化
    this.childNeedFreshCount++;
    console.log('child2' + `${this.childNeedFreshCount}`)
  }

  build() {
    Column() {
      Text('第二个子组件,要监听父组件productList数组的变化')
      Text('子组件这里也没有刷新/或只刷新一次__' + `${this.childNeedFreshCount}`)
    }
  }
}

function jsonToArray<T>(cls: ClassConstructor<T>, jsonStr: string): Array<T> {
  try {
    return plainToClass(cls, JSON.parse(jsonStr),
      { enableImplicitConversion: false, exposeDefaultValues: true }) as Array<T>
  } catch (err) {
    let error = err as BusinessError;
    return []
  }
}
分享
微博
QQ
微信
回复
1天前
相关问题
HarmonyOS Watch没有
31浏览 • 1回复 待解决
HarmonyOS Scroll方法执行改变
29浏览 • 1回复 待解决
@Watch装饰器的执行顺序
321浏览 • 1回复 待解决
HarmonyOS onAreaChange方法问题
44浏览 • 1回复 待解决
HarmonyOS 点击事件的方法
49浏览 • 1回复 待解决
HarmonyOS 组件是否有销毁方法
657浏览 • 1回复 待解决
支付成功后没有收到
1791浏览 • 1回复 待解决
HarmonyOS方法的值如何转成vp
29浏览 • 1回复 待解决
使用华为支付,没有支付成功的
470浏览 • 1回复 待解决