HarmonyOS 定义自定义组件

@Component
export struct NoteInTitle {

  @Prop title: string
  @Prop fontSize: number = 13
  @Prop enable: boolean = true
  // maxLines属性只有某些场景需要，这个导致我的build方法写了一个大的if-else，有没有更好的写法呢？
  @Prop maxLines: number

  build() {
    if (this.maxLines) {
      Text(this.title)
        .fontSize(this.fontSize)
        .enabled(this.enable)
        .maxLines(this.maxLines)
        .stateStyles({
          normal: {
            .fontColor($r('app.color.normal_of_title_text'))
          },
          disabled: {
            .fontColor($r('app.color.disable_of_text'))
          }
        })
    } else {
      Text(this.title)
        .fontSize(this.fontSize)
        .enabled(this.enable)
        .maxLines(this.maxLines)
        .stateStyles({
          normal: {
            .fontColor($r('app.color.normal_of_title_text'))
          },
          disabled: {
            .fontColor($r('app.color.disable_of_text'))
          }
        })
    }
  }
}

在上述代码中，创建了一个自定义组件：NoteInTitle，组件功能主要是在enable和disable时提供两种文本展示颜色；在某些场景下，需要设置maxLines属性，在外部引用该组件时，因为组件不是Text，无法单独设置maxLines；所以将maxLines属性封装在NoteInTitle内部，但这导致在为Text组件设置maxLines属性时，必须要写一个大的if else，这里有没有更好的写法呢？

HarmonyOS

fox280

2024-12-24 16:10:53

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

设置默认参数，调用的时候不用传递该参数，默认就行：

import promptAction from '@ohos.promptAction';
@Entry
@Component
struct myHello {
  @State message:string = 'Hello World';
  @State title1:string = '11111111111111111111111111111111111111';
  @State title2:string = '222222222222222222222222222222222222222222222222222222222222222222';
  @State title3:string = '333333333333333333333333333333333333333333333333333333333333333333333333333333333';
  @State title4:string = '444444444444444444444444444444444444444444444444444444444444444';
  @State maxNum1:number = 1;
  @State maxNum2:number = 2;
  @State maxNum3:number = 3;
  @State maxNum4:number = 4;
  build() {
    RelativeContainer() {
      Column() {
        Text('我是第一排')
          .height(30)
        this.NoteInTitle(this.title1, 16, true, this.maxNum1)
        this.NoteInTitle(this.title2, 12, true, this.maxNum2)
        this.NoteInTitle(this.title3, 12, true, this.maxNum3)
        this.NoteInTitle(this.title4, 12, true) // 默认1排
      }
    }
  }
  @Builder NoteInTitle(title:string, fontsize:number = 12, enable:boolean, maxLines : number = 1) {
    Text(title)
      .fontSize(fontsize)
      .enabled(enable)
      .maxLines(maxLines)
      .width(140)
  }
}

2024-12-24 19:28:16

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS 定义自定义组件

订阅鸿蒙技术特刊，精选内容抢先看