HarmonyOS ComposeListItem使用switch监听onChange方法变化异常

ComposeListItem({
  contentItem: ({
    iconStyle: IconType.SYSTEM_ICON,
    icon: $r("app.media.set_push_setup"),
    primaryText: '个性化推送开关',
  }),
  operateItem: ({
    switch: {
      isCheck: this.data.isAcceptInfo == 0,
      onChange: (isCheck: boolean) => {
        if (this.hasData) {
          this.data.isAcceptInfo = isCheck ? 0 : 1
          this.requestPushSwitch(this.data.isAcceptInfo)
        }
      }
    },
  })
})

//数据请求返回
MineModel.getSetInfo((data) => {
  param.success?.()
  this.data = data
  this.viewState = ViewProgressState.SUCCESS
  this.hasData = true
}, (_code) => {
  param.error?.()
  this.viewState = ViewProgressState.SUCCESS
})
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.

在数据请求结果回来后，如果this.data.isAcceptInfo从默认值1改为了0，那么这个时候会触发onChange方法，有什么方法可以避免这个数据请求结果回来的变化？

HarmonyOS

zxjiu

2024-12-25 13:36:26

浏览

回答 1

按赞同

按时间

Excelsior_abit

代码中的isCheck与data中的isAcceptInfo绑定，无法直接禁止掉isAcceptInfo 变化引起的onChange事件。可以设置一个与isAcceptInfo不同的UI状态变量，用于控制switch组件的显示。这个UI状态变量只在用户与switch组件交互时更新，参考如下：

data: {
  isAcceptInfo: 1, // 从接口获取的值
  uiIsCheck: this.data.isAcceptInfo == 0 // 初始UI状态，但后续不直接由isAcceptInfo控制
},

// 当接口返回新值时更新isAcceptInfo，但不更新uiIsCheck
updateFromAPI(newIsAcceptInfo: number) {
  this.data.isAcceptInfo = newIsAcceptInfo;
  //这里不更新uiIsCheck
},
operateItem: ({
  switch: {
    isCheck: this.data.uiIsCheck, // 使用uiIsCheck而不是isAcceptInfo
    onChange: (isCheck: boolean) => {
      if (this.hasData) {
        this.data.uiIsCheck = isCheck; // 更新UI状态
        // 注意：这里不更新isAcceptInfo，因为那是从接口获取的
        this.requestPushSwitch(isCheck ? 0 : 1); // 使用isCheck而不是data.isAcceptInfo
      }
    }
  },
})
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.

2024-12-25 16:24:51

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS ComposeListItem使用switch监听onChange方法变化异常

订阅鸿蒙技术特刊，精选内容抢先看