因為業務需求需要對從另一個元件獲取到的資料先做處理後新增在el-table的list裡面。

arr是一個數組
arr.forEach((item) => {
  item.stockId = item.id
  item.lossRate = 0
  item.quantity = 0
  item.materialId = null
  item.materialVersion = item.defaultBomVersion ? item.defaultBomVersion : null
  delete item.id
})
this.list = this.list.concat(arr)
 

但是這樣子處理的話會導致行內編輯無法正常雙向繫結（下圖怎麼輸入都無法改變）

查詢原因 根據官方文件定義：如果在例項建立之後新增新的屬性到例項上，它不會觸發檢視更新。
通俗點意思是我這arr是已經在另一個元件中建立的例項。是不能直接修改內部的物件
參考部落格：https://www.cnblogs.com/yanqiong/p/11174472.html
因為直接修改內部物件是無get set方法，導致雙向繫結失效

解決辦法（使用vue.set()和vue.delete()對物件做處理）
https://cn.vuejs.org/v2/api/#Vue-delete

arr.forEach((item) => {
  this.$set(item, 'stockId', item.id)
  this.$set(item, 'lossRate', 0)
  this.$set(item, 'quantity', 0)
  this.$set(item, 'materialId', null)
  this.$set(item, 'materialVersion', item.defaultBomVersion ? item.defaultBomVersion : null)
  this.$delete(item, 'id')
})
this.list = this.list.concat(arr)