鸿蒙状态管理-@Builder自定义构建函数

本文主要是介绍鸿蒙状态管理-@Builder自定义构建函数，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

@Builder 将重复使用的UI元素抽象成一个方法 在build方法里调用 使其成为 自定义构建函数

@Entry
@Component
struct BuilderCase {build() {Column(){Row(){Text("西游记").fontSize(20)}.justifyContent(FlexAlign.Center).backgroundColor("#f3f4f5").height(60).borderRadius(8).width("100%").padding({left:20,right:20})}.padding(20)}
}

将其中项 抽离出来

@Entry
@Component
struct BuilderCase {@BuildergetItemBuilder(itemName:string){Row(){Text(`${itemName}`).fontSize(20)}.justifyContent(FlexAlign.Center).backgroundColor("#f3f4f5").height(60).borderRadius(8).width("100%").padding({left:20,right:20})}build() {Column({ space:20 }){this.getItemBuilder("西游记")this.getItemBuilder("水浒传")this.getItemBuilder("红楼梦")this.getItemBuilder("三国演义")}.padding(20)}
}

同时我们也可以利用循环生成 简化代码

 @Statelist:string[]=[ '西游记','水浒传','红楼梦','三国演义', ]ForEach(this.list,(item:string)=>{this.getItemBuilder(item)})

这篇关于鸿蒙状态管理-@Builder自定义构建函数的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---