HarmonyOS鸿蒙Next中为什么使用let赋值就可以添加Proxy代理

HarmonyOS鸿蒙Next中为什么使用let赋值就可以添加Proxy代理

@Observed class Weather { temperature: number;

constructor(temperature: number) {
    this.temperature = temperature;
}

static increaseTemperature(weather: Weather) {
    weather.temperature++;
}

}

class Day { weather: Weather; week: string;

constructor(weather: Weather, week: string) {
    this.weather = weather;
    this.week = week;
}

}

@Entry @Component struct Page06 { @State day1: Day = new Day(new Weather(15), ‘Monday’);

build() {
    Column({ space: 10 }) {
        Child03({ weather: this.day1.weather })
    }
    .height('100%')
    .width('100%')
}

}

@Component struct Child03 { @ObjectLink weather: Weather;

reduceTemperature(weather: Weather) {
    weather.temperature--;
}

build() {
    Column({ space: 10 }) {
        Text(`The temperature of day1 is ${this.weather.temperature} degrees.`)
            .fontSize(20)
        Button('increaseTemperature')
            .onClick(() => {
                // 1.通过静态方法调用,无法触发UI刷新
                Weather.increaseTemperature(this.weather);

                // 2.通过赋值添加 Proxy 代理
                // let weather1 = this.weather;
                // Weather.increaseTemperature(weather1);
            })
        Button('reduceTemperature')
            .onClick(() => {
                // 1.使用this通过自定义组件内部方法调用,无法触发UI刷新
                // this.reduceTemperature(this.weather);

                // 2.通过赋值添加 Proxy 代理
                let weather2 = this.weather;
                this.reduceTemperature(weather2);
            })
    }
    .height('100%')
    .width('100%')
}

}

对 Child03 子组件中的reduceTemperature方法进行断点,发现weather的类型不一样。

我不理解,为什么使用 let 进行赋值,就可以添加 Proxy 代理。

使用a.b(this.object)形式调用,不会触发UI刷新


更多关于HarmonyOS鸿蒙Next中为什么使用let赋值就可以添加Proxy代理的实战教程也可以访问 https://www.itying.com/category-93-b0.html

12 回复

这应该是框架设定的:

// this.weather 作为参数传入方法时,通过this去取值的时候,得到是原始对象,而不是代理对象。 this.reduceTemperature(this.weather);

而通过赋值到一个对象时,weather2 继承了 this.weather 的代理关联。它是一个代理对象。 let weather2 = this.weather;

更多关于HarmonyOS鸿蒙Next中为什么使用let赋值就可以添加Proxy代理的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


请问,这些知识您是从哪些代码研究出来的,我也想看看。

请问,您说是框架设定的,我想问这个观点是研究哪篇文章或者哪段代码研究出来的?还有那个继承代理关联,是ArkTS特有的吗?还是ES6定义的?

build方法内,当@Observed@ObjectLink联合装饰的变量是Object类型、且通过a.b(this.object)形式调用时,b方法内传入的是this.object的原始对象,修改其属性,无法触发UI刷新。如下例中,通过静态方法或者使用this调用组件内部方法,修改组件中的this.weather.temperature时,UI不会刷新。

当通过@ObjectLink接收被@Observed装饰的类实例时,系统会自动为该实例生成Proxy代理对象,但是

直接使用原始对象引用时,操作的是未被代理的原始对象,导致状态变更无法被框架感知,而let赋值会触发代理对象的重新绑定,使得后续操作都基于Proxy代理对象进行。

项目名称

项目描述

  • 状态:进行中
  • 负责人:张三
  • 开始日期:2023-01-01
  • 结束日期:2023-12-31

成员

  • 张三
  • 李四
  • 王五

进度

  • 需求分析
  • 设计阶段
  • 开发阶段
  • 测试阶段
  • 上线准备

备注

  • 需要完成需求调研
  • 设计方案确认

找HarmonyOS工作还需要会Flutter的哦,有需要Flutter教程的可以学学大地老师的教程,很不错,B站免费学的哦:BV1S4411E7LY/?p=17

我想看一下底层代码是怎样运行的,请问它开源了吗,我该研究哪些开源项目?

期待HarmonyOS能在未来推出更多针对特定场景的优化功能。

GitHub仓库:https://github.com/OpenHarmony→arkui_ace_engine和arkui_advanced模块。

官方文档中《ArkTS语言规范》关于装饰器实现机制的设计说明。

在HarmonyOS Next中,使用let声明变量可以添加Proxy代理是因为let定义的变量是可变的,允许通过Proxy进行拦截和自定义操作。Proxy需要绑定目标对象,let声明的变量可以被重新赋值,因此适合作为Proxy的目标。而const声明的常量不可变,无法作为Proxy的目标对象。鸿蒙的ArkTS语言基于ECMAScript规范实现Proxy特性,支持对let变量进行get/set等操作的拦截。

在HarmonyOS Next中,使用let赋值后能添加Proxy代理的原因在于ArkTS的状态管理机制。当通过let声明新变量时,系统会为这个新变量创建一个新的Proxy代理对象,从而保持对原始对象的响应式跟踪。

具体分析:

  1. 直接使用this.weather时,调用的是原始对象引用,Proxy代理可能未被正确应用,导致状态变更无法触发UI更新。

  2. 使用let weather2 = this.weather时:

  • 系统会为weather2创建新的Proxy代理
  • 这个代理会捕获对temperature属性的修改
  • 状态变更能被响应式系统检测到,从而触发UI刷新

这种设计是ArkTS状态管理的工作机制,通过中间代理层来实现细粒度的状态追踪。建议在实际开发中遵循官方文档的推荐做法,使用let临时变量来确保状态变更能被正确响应。

回到顶部