map()實現(xiàn)json數(shù)組的深復(fù)制

實現(xiàn)深復(fù)制代碼片段:

<li v-for="(items, i) in shopFileListData" @click="onCheckBox(items)" :key="items.shopFileId" :class="{'li-checked': liChecked(items)}">
   <div class="source-file" style="width: 200px;">
        .....            
  </div>
</li>
export default {
    data() {
      return {
        shopFileListData:[],
        fileList:[],
      }
    },
    computed:{
      allChecked:{
        get: function() {
          return this.checkedCount == this.shopFileListData.length;
        },
        set: function (value) {
          if(value){
            this.checked = this.shopFileListData.map((items) => {
              this.fileList.push(items);
              return items.shopFileId+'';
            })
            //this.fileList = this.shopFileListData;
            console.log(JSON.stringify(this.fileList))
          }else {
            this.checked = [];
            this.fileList = []
          }
        }
      },
      checkedCount: {
        get: function() {
          return this.checked.length;
        }
      },
    },
  }

this.shopFileListData為json數(shù)組,通過map()把里面的items,push到this.fileList中,這樣進行了深復(fù)制。

注:
用ES6函數(shù)箭頭,才使this.fileList的this指向全局vue對象;
items.shopFileId+''是為了把items.shopFileId轉(zhuǎn)化成字符串類型;

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容