HarmonyOS 鸿蒙Next 自定义组件的方法，怎么实现，可以在build 内部调用

HarmonyOS 鸿蒙Next 自定义组件的方法，怎么实现，可以在build 内部调用

@Component
struct CustomView {
  build() {
  }
  // 自定义的函数
  onLoaded() {
  }
}

@Component
struct ParentView {
  build() {
    // onLoaded() Deveco 会提示错误
    CustomView().onLoaded()
  }
}

本意是希望在CustomView 内部初始化后，执行onLoaded方法。 查看一些代码， 貌似要用CommonMethod<> 作为返回，但具体怎么操作，还不太明白，求大神指点下！


更多关于HarmonyOS 鸿蒙Next 自定义组件的方法，怎么实现，可以在build 内部调用的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复
  1. @Component
  2. struct MyComponent {
  3. private countDownFrom: number = 0;
  4. private color: Color = Color.Blue;
  5. build() {}
  6. }
  7. @Entry
  8. @Component
  9. struct ParentComponent {
  10. private someColor: Color = Color.Pink;
  11. build() {
  12. Column() {
  13. // 创建MyComponent实例，并将创建MyComponent成员变量countDownFrom初始化为10，将成员变量color初始化为this.someColor
  14. MyComponent({ countDownFrom: 10, color: this.someColor })
  15. }
  16. }
  17. }

更多关于HarmonyOS 鸿蒙Next 自定义组件的方法，怎么实现，可以在build 内部调用的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


传递参数可以达到，但自定义函数无法实现，总觉得有缺陷！

添加

鸿蒙的设计要求build里只能写组件，可以引入CustomView()，因为它是个组件，但里面onLoaded可以写一些非组件的代码，违背了设计初衷所以会报错。

所以，你只要告诉鸿蒙，onLoaded声明成build类型，将来只写组件就不会报错了。

```javascript
[@Component](/user/Component)
struct CustomView {
  build() {
  }
  // 自定义的函数
  [@Builder](/user/Builder)
  onLoaded() {
  }
}

[@Entry](/user/Entry)
[@Component](/user/Component)
struct ParentView {
  build() {
    // onLoaded() Deveco 会提示错误
    CustomView().onLoaded()
  }
}

基本信息

  • 姓名: 张三
  • 年龄: 28
  • 职业: 软件工程师
  • 技能:
    • Java
    • Python
    • C++
  • 教育背景:
    • 本科: 计算机科学与技术
    • 研究生: 软件工程
  • 项目经验:
    • 项目一: 学生成绩管理系统
      • 描述: 开发了一个学生成绩管理的Web应用
      • 技术栈: Java, Spring Boot, MySQL
    • 项目二: 在线商城
      • 描述: 实现了一个在线购物平台
      • 技术栈: Python, Django, PostgreSQL

在HarmonyOS（鸿蒙Next）中，自定义组件的实现主要通过ArkUI框架进行。ArkUI提供了声明式UI开发方式，开发者可以通过扩展Component类或使用装饰器来创建自定义组件。以下是如何实现自定义组件以及在build方法内部调用的基本步骤：

  1. 定义自定义组件：

    • 创建一个新的类，继承自Component或使用@Component装饰器。
    • 在类中定义组件的结构和行为，包括build方法，该方法用于描述组件的UI结构。

  2. 实现build方法：

    • 在build方法中，使用ArkUI提供的UI组件（如Text、Button等）来构建自定义组件的UI。
    • 如果需要，可以在build方法内部调用其他自定义组件或系统组件。

  3. 调用自定义组件：

    • 在其他组件的build方法中，可以直接实例化自定义组件并将其添加到UI树中。

示例代码如下：

@Component
struct MyCustomComponent {
  build() {
    Column() {
      Text('This is a custom component')
        .fontSize(20)
        .fontColor(Color.Black)
      Button('Click Me')
        .onClick(() => {
          console.log('Button clicked');
        })
    }
  }
}

@Entry
struct MainPage {
  build() {
    Column() {
      MyCustomComponent()
    }
  }
}

在这个示例中，MyCustomComponent是一个自定义组件，它包含一个Text和一个Button。在MainPage的build方法中，直接调用了MyCustomComponent，将其添加到页面中。

通过这种方式，开发者可以在鸿蒙Next中灵活地创建和使用自定义组件，并在build方法内部进行调用。

回到顶部