vue+elementui 中全选框点中失效问题

情景：数据加载完成之后点击全选按钮无响应，后点击任一除全选框的复选框出现全选现象

  <div>
              <p>售卖区域</p>
          <el-checkbox :indeterminate="isIndeterminate" 
          v-model="checkAll" 
          @change="handleCheckAllChange">全选</el-checkbox>
          <div style="margin: 15px 0;"></div>
          <el-checkbox-group 
          v-model="checkedCities"
          @change="handleCheckedCitiesChange">
            <el-checkbox 
            v-for="city in cities" 
            :label="city" 
            :key="city"
            border>
            {
   
   {city}}
            </el-checkbox>
          </el-checkbox-group>
        </div>

 复选框的数据需要数组形式的，如果调用接口获取的数据不是数组形式，则可能出现以上问题

      handleCheckAllChange(val) {
        let list =[];
        for(let i in this.cities){
          list.push(this.cities[i])
        }
        this.checkedCities = val ? list : [];
        this.isIndeterminate = false;//控制样式
      },
      handleCheckedCitiesChange(value) {
        let checkedCount = value.length;
        this.checkAll = checkedCount === this.cities.length;
        this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
      },