官方讲的很大概,有些细节得去看源码才能知道,不过还是撸出来一个简易版的的item了
import image from '@ohos.multimedia.image';@Entry // 表示入口
@Component
struct Index {@State isComplete:boolean = false;private totalTasks: Array<string> = [];aboutToAppear() { // 初始化this.totalTasks = ["早起晨练","准备早餐","阅读名著","学习ArkTS","看剧放松"]}build() {Row() {Column() {Text('代办').fontSize(28).fontWeight(FontWeight.Bold).fontColor('#ff03')ForEach(this.totalTasks, (item) => {ToDoItem({content: item})})}.width('100%')}.height('100%')}
}@Component
struct ToDoItem {private content?:string;@State isComplete:boolean = false;build() {Row() {Image($r('app.media.app_icon')).width(30)Text(this.content).fontSize(28).fontColor(this.isComplete ? '#FF0000' : '#333').onClick(() => {this.isComplete = !this.isComplete;})}.borderRadius(10).backgroundColor('#f1f1f1').width(300).height(30)}
}