美文网首页
鸿蒙开发-builder使用

鸿蒙开发-builder使用

作者: 激扬飞雪 | 来源:发表于2024-05-19 21:33 被阅读0次
    @Entry
    @Component
    struct BuilderCase {
      @State message: string = 'Hello World'
      @State formData: FormData = {
        type: '漏油',
        location: '北京',
        time: '10-10'
      }
    
      @Builder itemLayout($$: CellParam) {
        Row(){
          Text($$.leftTitle)
            .fontSize(18)
          Text($$.rightTitle)
            .fontSize(18)
        }
        .justifyContent(FlexAlign.SpaceBetween)
        .width('100%')
        .backgroundColor(Color.White)
        .borderRadius(12)
        .padding({
          top: 15,
          bottom: 15,
          left: 10,
          right: 10
        })
      }
      build() {
        Row() {
    
          Column({space: 10}) {
            Text(JSON.stringify(this.formData))
            this.itemLayout({leftTitle: '异常类型', rightTitle: this.formData.type})
            this.itemLayout({leftTitle: '异常地址', rightTitle: this.formData.location})
            this.itemLayout({leftTitle: '异常时间', rightTitle: this.formData.time})
            Button('修改异常位置')
              .onClick(() => {
                this.formData.location = '河北省'
              })
          }
          .margin({
            left: 10,
            right: 10
          })
        }
        .height('100%')
        .backgroundColor(Color.Gray)
      }
    }
    
    class FormData {
      type: string = ""
      location: string = ""
      time: string = ""
    }
    
    class CellParam {
      leftTitle: string
      rightTitle: string
    }
    
    image.png

    相关文章

      网友评论

          本文标题:鸿蒙开发-builder使用

          本文链接:https://www.haomeiwen.com/subject/sjzwfjtx.html