当前位置:   article > 正文

ArkTS中自定义组件_arkts自定义组件

arkts自定义组件

一、组件位置

一个项目下所有的自定义的组件名不可以重复,无论是否在一个ets文件中

在这里插入图片描述

二、Hello.ets自定义组件

自定义组件

1:组件必须使用@Component装饰
2:@Entry装饰在哪个组件上,页面就展示哪个组件(主组件)
3:被@Entry装饰的主组件,build()中必须有且仅有一个根容器组件,其它自定义组件,build()中有且仅有一个根组件。

@Component
export struct Hello {
    private  title:ResourceStr
     build(){
       Row(){
         Text(this.title)
           .fontSize(30)
           .fontWeight(FontWeight.Bold)
       }
     }

}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

三、Second.ets父组件

在这里插入图片描述

// Second.ets
import {Hello} from '../compontent/Hello'
@Entry
@Component
struct Second {
  @State message: string = 'Hi there'
  build() {
    Row() {
      Column() {
        Hello({title:'hello组件'}
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
        Divider()
      }
      .width('100%')
    }
    .height('100%')
  }
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20

链接: https://blog.csdn.net/dfsdcvbhjnj/article/details/134744131?spm=1001.2014.3001.5502

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Monodyee/article/detail/320022
推荐阅读
相关标签
  

闽ICP备14008679号