HarmonyOS鸿蒙学习笔记(3)@Component注解自定义组件简单说明
@Component自定义组件说明
·
@Component
注解的作用是用来构建自定义组件,具体的说明可以参考资料:@Component组件官方文档。
@Component自定义组件的简单使用
本文通过一个简单的例子来说明@Component
的作用。例子代码如下:
在下面代码提供了两个组件AComponent
和BComponent
,每个组件都提供了一个Text
文本组件,其中AComponent
使用了BComponent
组件。
@Entry
@Component
struct AComponent {
//自定义组件必须定义build方法。
build() {
Row() {
Column() {
//蓝色文字
Text("AComponent").fontSize(30).fontColor(Color.Blue)
//红色文字
BComponent()
}.width('50%')
}
.height('100%')
}
}
@Component
struct BComponent {
build() {
Text("BComponent").fontSize(30).fontColor(Color.Red)
}
}
运行效果如下
组件发布
当我们需要将X
文件下的组件交给Y
文件下的组件使用的时候,需要使用export
修饰,比如我们将 FirstPage.ets
文件的AComponent
发布出去:
那么在SecondPage.ets就可以使用了:
更多推荐
已为社区贡献13条内容
所有评论(0)