鸿蒙_组件内和组件外使用@Builder自定义构建函数的区别

梁山好汉（Ls_man）2026-04-07 13:00

通过对自定义构建函数的学习，我发现在组件内和组件外编写和使用方面有一些小差别，通过新建一个页面TestBuilderInsideAndOutside来测试一下：

复制代码

@Entry
@Component
struct TestBuilderInsideAndOutside {
  @State message: string = 'Test Builder Inside And Outside';

  //组件内自定义构建函数，不加function
  @Builder
  InsideBuilder(from: string) {
    Text(from + ' Text in Inside Builder').fontSize(22)
  }

  build() {
    Column() {
      Text(this.message)
        .fontSize(22)
        .fontWeight(FontWeight.Bold)
        .onClick(() => {
          this.message = 'Welcome';
        })
        .padding({ bottom: 30 })

      //使用组件内自定义构建函数需要加this
      this.InsideBuilder('组件内')

      //使用组件外自定义构建函数不需要加this
      OutsideBuilder('组件外')

    }
    .height('100%')
    .width('100%')
  }
}

//组件外自定义构建函数，需要加function
@Builder
function OutsideBuilder(from: string) {
  Text(from + ' Text in Outside Builder').fontSize(22)
}

通过测试我们发现，在组件外需要加function，使用时不需要this，组件内不需要加function，但使用时需要加this，而且在组件内编写自定义构建函数时，要写在struct内部，build()外部，和普通状态变量的编写位置是相同的，如果写错了位置会报错。