HarmonyOS鸿蒙Next中@State装饰器，置空数据后，打印显示为空，但是界面还是留有数据 页面上有个清除按钮，全选数据后，点击清除。判断是否全选，如果全选，则置空数据并且将全选框置为非勾选状态。现在的问题是，清除后，日志显示数据为空，但是界面留有数据。关键点：如果删除this.isSelectedAll = false这行代码，则页面是正常的。这是什么原因？

api版本12，真机和模拟器都能复现。

import { promptAction } from '@kit.ArkUI'

interface ICodeAndName {
  code: string
  name: string
  isSelected: boolean
}

@Entry
@Component
struct Index {
  [@State](/user/State) listDataArr: ICodeAndName[] = []
  [@State](/user/State) isSelectedAll: boolean = false


  async clear() {
    const index = this.listDataArr.findIndex(item => item.isSelected === true)

    if (index === -1) {
      promptAction.showToast({ message: '请勾选要清除的数据后再重试！' })
      return
    }
    const i = await promptAction.showDialog({
      title: 'showDialog Title Info',
      message: 'Message Info',
      buttons: [
        {
          text: '取消',
          color: '#000000'
        },
        {
          text: '确定',
          color: '#000000'
        }
      ]
    })
    if (i.index === 1) {
      if (this.isSelectedAll) {
        this.listDataArr = []
        this.isSelectedAll = false
        console.log(JSON.stringify(this.listDataArr))
      }
    }

  }


  aboutToAppear(): void {
    this.listDataArr = [{
      code: '1',
      name: '1',
      isSelected: false
    }]
  }


  build() {
    Column() {

      Column() {

        Text() {
          Span('已经绑定')
          Span(`${this.listDataArr.length}`)
            .fontColor(Color.Red)
          Span('条: ')
        }
        .width('100%')
        .margin({ top: 15 })
        .padding({ left: 50 })
        .fontSize(20)
        .fontWeight(600)
      }
      .width('100%')
      .padding({ top: 15, bottom: 10 })

      Column() {
        Row() {
          Column() {
            CheckboxGroup({ group: 'checkboxGroup' })
              .checkboxShape(CheckBoxShape.ROUNDED_SQUARE)
              .height(16)
              .aspectRatio(1)
              .selectAll($$this.isSelectedAll)
          }
          .width(40)

          Text('编码')
            .layoutWeight(1)
            .fontSize(24)
            .textAlign(TextAlign.Center)
            .border({ width: { left: 1, right: 1 } })
            .padding({ top: 5, bottom: 5 })
          Text('名称')
            .layoutWeight(1)
            .fontSize(24)
            .textAlign(TextAlign.Center)
            .padding({ top: 5, bottom: 5 })
        }
        .width('100%')
        .border({ width: { bottom: 1 } })
        .backgroundColor('#E4EAFF')

        List() {
          ForEach(this.listDataArr, (item: ICodeAndName, index: number) => {
            ListItem() {
              Row() {
                Row() {
                  Checkbox({ group: 'checkboxGroup' })
                    .shape(CheckBoxShape.ROUNDED_SQUARE)
                    .height(16)
                    .aspectRatio(1)
                    .select(item.isSelected)
                    .onChange(() => {
                      this.listDataArr[index] = {
                        code: item.code,
                        name: item.name,
                        isSelected: !item.isSelected
                      } as ICodeAndName
                    })
                }
                .justifyContent(FlexAlign.Center)
                .width(40)

                Row() {
                  Text(item.code)
                    .layoutWeight(1)
                    .fontSize(19)
                    .textAlign(TextAlign.Center)
                    .border({ width: { left: 1, right: 1 } })
                    .padding({
                      top: 6,
                      bottom: 6,
                      left: 4,
                      right: 4
                    })
                  Text(item.name)
                    .layoutWeight(1)
                    .fontSize(19)
                    .textAlign(TextAlign.Center)
                    .padding({
                      top: 6,
                      bottom: 6,
                      left: 4,
                      right: 4
                    })
                }
                .layoutWeight(1)
              }
              .width('100%')
              .border({ width: { bottom: 1 } })
            }
          })
        }
        .width('100%')
        .layoutWeight(1)

      }
      .width('95%')
      .layoutWeight(1)
      .border({ width: 1 })
      .margin({ top: 10, bottom: 10 })

      Row() {
        Text('清除')
          .buttonExtend()
          .onClick(() => {
            this.clear()
          })
        Text('提交')
          .buttonExtend()
          .onClick(() => {
          })
      }
      .width('100%')
      .padding({ left: 40, right: 40 })
      .justifyContent(FlexAlign.SpaceBetween)
    }
    .width('100%')
    .height('100%')
    .backgroundColor('#F5F5F9')
    .padding({ bottom: 20 })
  }
}

@Extend(Text)
function buttonExtend() {
  .width(100)
  .height(35)
  .textAlign(TextAlign.Center)
  .backgroundColor('#126DDE')
  .fontSize(20)
  .fontColor('#fff')
  .borderRadius(5)
}