HarmonyOS 在CheckboxGroup中,如何知道当前用户选择Checkbox的id或name

在CheckboxGroup中,如何知道当前用户选择Checkbox的id或name?

场景描述:有多个表盘供用户选择,需要把用户选择的表盘发给蓝牙设备。现在用CheckboxGroup可以实现多选,却无法知道用户选择了哪些?

HarmonyOS
2024-12-26 16:51:04
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Excelsior_abit

请参考下以下demo:

class CheckName {
  public id: string
  public productName: string
  constructor(id: string, productName: string) {
    this.id = id
    this.productName = productName
  }
}
@Entry
@Component
struct CheckboxExample {
  @State services: CheckName[] = [
    new CheckName('1', 'checkbox1'),
    new CheckName('2', 'checkbox2'),
    new CheckName('3', 'checkbox3'),
    new CheckName('4', 'checkbox4'),
  ];
@State clickIndex:string = ''
  @State clickName:string = ''
  @State selectIndexList: Array<string> = []
  build() {
    Scroll() {
      Column() {
        // 全选按钮
        Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
          CheckboxGroup({ group: 'checkboxGroup' })
            .selectedColor('#007DFF')
            .onChange((itemName: CheckboxGroupResult) => {
              console.info("checkbox group content" + JSON.stringify(itemName))
            })
          Text('Select All').fontSize(14).lineHeight(20).fontColor('#182431').fontWeight(500)
        }

        ForEach(this.services, (item: CheckName, index) => {
          Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
            Checkbox({ name: item.productName, group: 'checkboxGroup' })
              .selectedColor('#007DFF')
              .onChange((value: boolean) => {
                this.clickIndex = item.id;
                this.clickName = item.productName;
                if(value == true) {
                  this.selectIndexList.push(item.productName);
                }else {
                  this.selectIndexList = this.selectIndexList.filter((element) => {
                    return element !== item.productName;
                    // 返回不等于要删除元素的元素构成新数组
                  });
                }
              })
            Text(item.productName).fontSize(14).lineHeight(20).fontColor('#182431').fontWeight(500)
          }.margin({ left: 36 })
        }, (item: string) => item)
        Text(this.selectIndexList.toString()).fontSize(14).lineHeight(20).fontColor('#182431').fontWeight(500)
      }
    }
  }
}
分享
微博
QQ
微信
回复
2024-12-26 18:32:31
相关问题
怎么获取当前用户用户ID
965浏览 • 1回复 待解决
HarmonyOS checkbox复选框使用选择问题
210浏览 • 1回复 待解决
HarmonyOS 列表checkbox多选
197浏览 • 1回复 待解决
HarmonyOS 折叠屏如何知道当前状态
195浏览 • 1回复 待解决
如何指定判断当前编译架构
787浏览 • 1回复 待解决
有获取当前线程id和主线程id方式吗?
1286浏览 • 1回复 待解决
如何去除Checkbox阴影效果
2256浏览 • 1回复 待解决
根据list某项id如何sort排序
896浏览 • 1回复 待解决