vue對組件以數組方式賦值的問題

當從后台直接調接口返回數據

直接將數組array賦值給定義的變量，會導致組件無法更改其它值，例如多選框，多選下拉框，會導致無法選中其它的值，也無法取消當前已賦值的選中項

 

data() {
    return {  
　　　　　infoForm:{
          array: []
       }  
    }
  }, 
//調接口賦值
getApi(){
    get().then(res=>{
//返回的數據，info里面包含array字段
       this.infoForm = res.info
    }) 
}   

以上代碼將會出現問題，頁面加載的時候我們已經對infoform里面的array初始化一次了，數組結構已定義，后面直接將數組改變，導致組件無法讀取

改變方式

data() {
    return {  
　　　　　infoForm:{
          array: []
       }  
    }
  }, 
//調接口賦值
getApi(){
    get().then(res=>{
//定義變量
        let info = res.info
//初始化數組
        info.array = []
//將info拷貝到infoForm
       this.infoForm = Object.assign({},this.info)
//將array的值加入infoForm的array
          info.array.forEach(item =>{
            _this.infoForm.array.push(
              item
            )
          })
    }) 
}