From d4bc86f0700c5b32f7e288db3db6e1b1bfe4c0bc Mon Sep 17 00:00:00 2001 From: zhuzijia Date: Wed, 9 Aug 2023 11:29:13 +0800 Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E8=87=AA=E5=AE=9A=E4=B9=89?= =?UTF-8?q?=E5=B1=9E=E6=80=A7=E6=96=B9=E6=B3=95,=E6=8C=91=E5=8D=953.2relea?= =?UTF-8?q?se?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: zhuzijia Change-Id: Ifd7de3289ff116ec6ecb10c69f7c5e30d814da0e --- .../arkts-create-custom-components.md | 68 +------------------ 1 file changed, 1 insertion(+), 67 deletions(-) diff --git a/zh-cn/application-dev/quick-start/arkts-create-custom-components.md b/zh-cn/application-dev/quick-start/arkts-create-custom-components.md index 8c602c6937..9270917414 100644 --- a/zh-cn/application-dev/quick-start/arkts-create-custom-components.md +++ b/zh-cn/application-dev/quick-start/arkts-create-custom-components.md @@ -62,7 +62,7 @@ struct ParentComponent { - [自定义组件的基本结构](#自定义组件的基本结构) -- [成员函数/变量](#成员函数变量) +- 成员函数/变量 - [自定义组件的参数规定](#自定义组件的参数规定) @@ -70,8 +70,6 @@ struct ParentComponent { - [自定义组件通用样式](#自定义组件通用样式) -- [自定义属性方法](#自定义属性方法) - ## 自定义组件的基本结构 @@ -314,67 +312,3 @@ struct MyComponent { > **说明:** > > ArkUI给自定义组件设置样式时,相当于给MyComponent2套了一个不可见的容器组件,而这些样式是设置在容器组件上的,而非直接设置给MyComponent2的Button组件。通过渲染结果我们可以很清楚的看到,背景颜色红色并没有直接生效在Button上,而是生效在Button所处的开发者不可见的容器组件上。 - - -## 自定义属性方法 - -自定义组件不支持提供自定义属性方法,可以借助类似Controller控制器能力,提供自定义接口。 - - -```ts -// 自定义controller -export class MyComponentController { - item: MyComponent = null; - - setItem(item: MyComponent) { - this.item = item; - } - - changeText(value: string) { - this.item.value = value; - } -} - -// 自定义组件 -@Component -export default struct MyComponent { - public controller: MyComponentController = null; - @State value: string = 'Hello World'; - - build() { - Column() { - Text(this.value) - .fontSize(50) - } - } - - aboutToAppear() { - if (this.controller) - this.controller.setItem(this); // 绑定controller - } -} - -// 使用处逻辑 -@Entry -@Component -struct StyleExample { - controller = new MyComponentController(); - - build() { - Column() { - MyComponent({ controller: this.controller }) - } - .onClick(() => { - this.controller.changeText('Text'); - }) - } -} -``` - -在上面的示例中: - -1. 通过子组件MyComponent的aboutToAppear方法,把当前的this指针传递给MyComponentController的item成员变量。 - -2. 在StyleExample父组件中持有controller实例,调用controller的changeText方法,即相当于通过controller持有的MyComponent子组件的this指针,改变MyComponent的状态变量value的值。 - -通过controller的封装,MyComponent对外暴露了changeText的接口,所有持有controller的实例都可以通过调用changeText接口,改变MyComponent的状态变量value的值。 -- GitLab