HarmonyOS 鸿蒙Next 如何在Grid中的循环生成的GridItem中的Button点击后只更新该按钮背景颜色
HarmonyOS 鸿蒙Next 如何在Grid中的循环生成的GridItem中的Button点击后只更新该按钮背景颜色
build() {
  Column({ space: 20 }) {
    Row({ space: 10 }) {
      Toggle({ type: ToggleType.Button, isOn: false }) {
        Text(this.studyMode)
          .fontColor(’#182431’)
          .fontSize(12)
      }.width(75)
      .onChange((isOn: boolean) => {
        if (isOn) {
          this.studyMode = “学习模式”;
          this.isStudyMode = true;
          this.promptStr = “点按汉字以显示详细信息”;
        } else {
          this.studyMode = “测字模式”;
          this.isStudyMode = false;
          this.promptStr = “点按不认识的汉字以记录”;
        }
      })
      Button(“下一组”)
        .type(ButtonType.Capsule)
        .onClick(() => {
          this.pageNo += 1;
          this.dispArray = this.allCC.slice(this.pageNo * this.pageSize, (this.pageNo + 1) * this.pageSize)
        })
        .fontSize(12)
        .height(30)
        .width(75)
      Button(“上一组”)
        .type(ButtonType.Capsule)
        .onClick(() => {
          if (this.pageNo > 0) {
            this.pageNo -= 1;
            this.dispArray = this.allCC.slice(this.pageNo * this.pageSize, (this.pageNo + 1) * this.pageSize)
          }
        })
        .fontSize(12)
        .height(30)
        .width(75)
    }.align(Alignment.Center)
    Text(this.promptStr)
    Grid() {
      ForEach(this.dispArray, (item: EduCC, index: number) => {
        GridItem() {
          Button(item.smp_cc).id(item.pk_cc).backgroundColor(this.btnBackgroundColor)
            .onClick((e) => {
              console.info(item.smp_cc,e.target)
              if (this.isStudyMode) {
                this.getUIContext().getRouter().pushUrl({ url: “pages/Index”, params: { “cc”: item.smp_cc } })
              } else {
                //todo 按当前登录用户记录不认识的汉字到后台保存
                this.saveNotRcgnzd(item);
                //todo 改变当前按钮显示状态,标示出是认识还是不认识的汉字
                this.btnBackgroundColor= Color.Green;
                // 定义一个eventId为1的事件,事件优先级为Low
                let event: emitter.InnerEvent = {
                  eventId: 1,
                  priority: emitter.EventPriority.LOW
                };
                let eventData: emitter.EventData = {
                  data: {
                    content: item,
                    id: 1,
                    isEmpty: false
                  }
                };
                // 发送eventId为1的事件,事件内容为eventData
                emitter.emit(event, eventData);
              }
            })
        }
      })
    }.columnsGap(10).rowsGap(15).padding(10).onClick((e)=>{
      console.log(“Grid”,e.target)
    })
  }
}更多关于HarmonyOS 鸿蒙Next 如何在Grid中的循环生成的GridItem中的Button点击后只更新该按钮背景颜色的实战教程也可以访问 https://www.itying.com/category-93-b0.html
        
          3 回复
        
      
      
        将按钮封装成一个组件,内置一个布尔值控制颜色,这样最简单,耦合也低
更多关于HarmonyOS 鸿蒙Next 如何在Grid中的循环生成的GridItem中的Button点击后只更新该按钮背景颜色的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
谢谢,昨天已经处理完了,和你说的思路一致,谢谢!
        
      
                  
                  
                  

