diff --git a/zh-cn/application-dev/quick-start/arkts-new-observedV2-and-trace.md b/zh-cn/application-dev/quick-start/arkts-new-observedV2-and-trace.md index 14ead6710bb4f5c82d98ef6020f85ab50120f31b..570639b9352c1e1dacc3d4ff9773b8d125444e15 100644 --- a/zh-cn/application-dev/quick-start/arkts-new-observedV2-and-trace.md +++ b/zh-cn/application-dev/quick-start/arkts-new-observedV2-and-trace.md @@ -2,11 +2,11 @@ 为了增强状态管理框架对类对象中属性的观测能力，开发者可以使用\@ObservedV2装饰器和\@Trace装饰器装饰类以及类中的属性。 ->**说明：** +> **说明：** > ->\@ObservedV2与\@Trace装饰器从API version 12开始支持。 +> \@ObservedV2与\@Trace装饰器从API version 12开始支持。 > ->当前状态管理（V2试用版）仍在逐步开发中，相关功能尚未成熟，建议开发者尝鲜试用。 +> 当前状态管理（V2试用版）仍在逐步开发中，相关功能尚未成熟，建议开发者尝鲜试用。 ## 概述 @@ -122,13 +122,13 @@ struct Index { ## 装饰器说明 | \@ObservedV2类装饰器 | 说明 | -| ------------------ | ----------------------------------------------------- | -| 装饰器参数 | 无 | -| 类装饰器 | 装饰class。需要放在class的定义前，使用new创建类对象。 | +| -------------------- | ----------------------------------------------------- | +| 装饰器参数 | 无 | +| 类装饰器 | 装饰class。需要放在class的定义前，使用new创建类对象。 | -| \@Trace成员变量装饰器 | 说明 | -| --------------------- | ------------------------------------------------------------ | -| 装饰器参数 | 无 | +| \@Trace成员变量装饰器 | 说明 | +| --------------------- | ---------------------------------------------------------------------------------------------- | +| 装饰器参数 | 无 | | 可装饰的变量 | class中成员属性。属性的类型可以为number、string、boolean、class、Array、Date、Map、Set等类型。 | ## 观察变化 @@ -211,14 +211,12 @@ struct Index { } ``` -- \@Trace装饰内置类型时，可以观测各自API导致的变化： - - | 类型 | 可观测变化的API | - | ----- | ------------------------------------------------------------ | - | Array | push、pop、shift、unshift、splice、copyWithin、fill、reverse、sort | +* @Trace装饰内置类型时，可以观测各自API导致的变化：| 类型 | 可观测变化的API | + | ----- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | + | Array | push、pop、shift、unshift、splice、copyWithin、fill、reverse、sort | | Date | setFullYear, setMonth, setDate, setHours, setMinutes, setSeconds, setMilliseconds, setTime, setUTCFullYear, setUTCMonth, setUTCDate, setUTCHours, setUTCMinutes, setUTCSeconds, setUTCMilliseconds | - | Map | set, clear, delete | - | Set | add, clear, delete | + | Map | set, clear, delete | + | Set | add, clear, delete | ## 使用限制 @@ -276,35 +274,34 @@ struct Comp { class User { @Trace name: string = "Tom"; // 错误用法，编译时报错 } -``` - -以下写法没有深度观测的能力，@ObservedV2装饰器不会生效。 -```ts @ObservedV2 class Person { - @Track name: string = "Jack"; // 无深度观测能力 + @Track name: string = "Jack"; // 错误用法，编译时报错 } ``` -- 使用\@ObservedV2与\@Trace装饰的类不能和[\@State](arkts-state.md)以及现有框架的装饰器混合使用。 +- 使用\@ObservedV2与\@Trace装饰的类不能和[\@State](arkts-state.md)等V1框架的装饰器混合使用。 ```ts + // 以@State装饰器为例 @ObservedV2 class Job { @Trace jobName: string = "Teacher"; } + @ObservedV2 class Info { @Trace name: string = "Tom"; @Trace age: number = 25; job: Job = new Job(); } + @Entry @Component struct Index { - @State info: Info = new Info(); // 无法混用，运行时crash + @State info: Info = new Info(); // 无法混用，编译时报错 build() { Column() { @@ -324,7 +321,52 @@ struct Index { } ``` -- \@ObservedV2的类实例目前不支持使用JSON.stringify进行序列化。 +- 继承自@ObservedV2与\@Trace装饰的类不能和[\@State](arkts-state.md)等V1的装饰器混用，继承场景下会运行crash。 + +```ts +// 以@State装饰器为例 +@ObservedV2 +class Job { + @Trace jobName: string = "Teacher"; +} + +@ObservedV2 +class Info { + @Trace name: string = "Tom"; + @Trace age: number = 25; + job: Job = new Job(); +} + +class Message extends Info { + constructor() { + super(); + } +} + +@Entry +@Component +struct Index { + @State message: Message = new Message(); // 无法混用，运行时crash + + build() { + Column() { + Text(`name: ${this.message.name}`) + Text(`age: ${this.message.age}`) + Text(`jobName: ${this.message.job.jobName}`) + Button("change age") + .onClick(() => { + this.message.age++; + }) + Button("Change job") + .onClick(() => { + this.message.job.jobName = "Doctor"; + }) + } + } +} +``` + +* @ObservedV2的类实例目前不支持使用JSON.stringify进行序列化。 ## 使用场景 @@ -384,7 +426,6 @@ struct Page { } ``` - ### 继承类场景 \@Trace支持在类的继承场景中使用，无论是在基类还是继承类中，只有被\@Trace装饰的属性才具有被观测变化的能力。 @@ -392,7 +433,6 @@ struct Page { ![arkts-old-state-management](figures/arkts-new-observed-and-track-extend-sample.png) - 创建类Son和类Cousin的实例，点击Button('change Son age')和Button('change Cousin age')可以触发UI的刷新。 ```ts @@ -738,7 +778,6 @@ struct SetSample { } ``` - ### \@Trace装饰Date类型 * \@Trace装饰的Date类型属性可以观测调用API带来的变化，包括 setFullYear、setMonth、setDate、setHours、setMinutes、setSeconds、setMilliseconds、setTime、setUTCFullYear、setUTCMonth、setUTCDate、setUTCHours、setUTCMinutes、setUTCSeconds、setUTCMilliseconds。