技術標籤：javascriptvue.js

我的需求是陣列選擇刪除掉相應資料，後臺需要我返回字串連線的資料，替換修改。

 <el-checkbox-group v-model="checkList" @change="handleCheckedCitiesChange">
 <el-checkbox :label="index" v-for="(item,index) in files"  :key="item.index"  > </el-checkbox
 
>
 </el-checkbox-group>

這裡我選擇用迴圈的index作為複選框動態的laber,勾選相應的項，就把索引index新增到定義的checkList陣列中。
然後迴圈刪除掉要處理的陣列的相應下標項。

問題出現
迴圈下我用陣列的splice方法刪除對應項 this.files.splice（item,1）,但用splice刪除陣列時，陣列發生改變，相應的索引值也會發生變化，就導致有的索引在改變之後沒有了，無法刪除。

解決方法

  this.checkList.sort();
for (var i = this.checkList.length - 1; i >
 
= 0; i--) {
        this.files.splice(this.checkList[i], 1);
      }

這裡採用逆向迴圈，從索引大的值開始刪除，索引就算改變了也會不會出翔找不到對應的索引項。
這裡我用到了sort()給數值排序是因為我用的index作為動態laber，新增的索引可能是第0個開始也可能是第n個，所以這裡加上排序，就完美解決了這個問題。

¹