• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 复用标识
2
3reuseId用于标记自定义组件复用组,当组件回收复用时,复用框架将根据组件的reuseId来划分组件的复用组。
4
5>  **说明:**
6>
7> 从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
8
9
10## reuseId
11
12reuseId(id: string): T
13
14复用标识,用于划分自定义组件的复用组。
15
16>  **说明:**
17>
18> 根据不同场景灵活设置reuseId,实现最佳复用效果。最佳实践请参考[组件复用-使用reuseId标记布局发生变化的组件](https://developer.huawei.com/consumer/cn/doc/best-practices/bpta-component-reuse#section1239555818211)19
20**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。
21
22**系统能力:** SystemCapability.ArkUI.ArkUI.Full
23
24**参数:**
25
26| 参数名 | 类型   | 必填 | 说明                                   |
27| ------ | ------ | ---- | -------------------------------------- |
28| id     | string | 是   | 复用标识,用于划分自定义组件的复用组。 |
29
30**返回值:**
31
32| 类型 | 说明 |
33| --- | --- |
34| T | 返回当前组件。 |
35
36## 示例
37
38该示例通过reuseId标识自定义组件的复用组。
39
40```ts
41// xxx.ets
42@Entry
43@Component
44struct MyComponent {
45  @State switch: boolean = true;
46  private type: string = "type1";
47
48  build() {
49    Column() {
50      Button("ChangeType")
51        .onClick(() => {
52          this.type = "type2"
53        })
54      Button("Switch")
55        .onClick(() => {
56          this.switch = !this.switch
57        })
58      if (this.switch) {
59        ReusableChildComponent({ type: this.type })
60          .reuseId(this.type)
61      }
62    }
63    .width('100%')
64    .height('100%')
65  }
66}
67
68@Reusable
69@Component
70struct ReusableChildComponent {
71  @State type: string = ''
72
73  aboutToAppear() {
74    console.log(`ReusableChildComponent Appear ${this.type}`)
75  }
76
77  aboutToReuse(params: ESObject) {
78    console.log(`ReusableChildComponent Reuse ${this.type}`)
79    this.type = params.type;
80  }
81
82  build() {
83    Row() {
84      Text(this.type)
85        .fontSize(20)
86        .margin({ left: 10 })
87    }.margin({ left: 10, right: 10 })
88  }
89}
90```
91