elementUI表格编辑状态下，如何获取修改过的行

表格再编辑状态，需要获取到哪一行数据被修改了，面对这样一个场景，我们可以结合element的row-click事件以及动态的监听$watch来实现。
tableList，代表表格的数据， rowIds代表需要记录的id数组的集合， isUpdateTableList为true代表表格进入编辑状态了
import { cloneDeep } from ‘lodash-es’; //cloneDeep是进行深拷贝的插件

 /** 编辑状态下，监听行数据是否变化 */
    rowClick(row, column, event) {
      // 编辑状态下对修改过得行数据的id进行保存
      if (this.isUpdateTableList) {
        const rowPre = cloneDeep(row);
        this.$watch(
          () => {
            return row;
          },
          {
            handler(newVal, oldVal) {
              let that = this;
              // console.log(newVal, oldVal, cloneDeep(newVal) == cloneDeep(oldVal))
              if (newVal !== rowPre) { // 如果行数据发生变化，则记录其id
                that.rowIds.push(row.id);
                that.rowIds = [...new Set(that.rowIds)];
                console.log(that.rowIds);
              }
            },
            deep: true,
          },
        );
      }
    },
   

上面的方法只是获取到了具体修改过行的id，如果需要得到修改过的行的具体数据，可以过滤

 /** 筛选编辑过的行数据公共方法 */
    filterUpdateRow() {
      return this.tableList.filter((item, index) => {
        //函数本身返回布尔值，只有当返回值为true时，当前项存入新数组。
        return  this.rowIds.indexOf(item.id)>-1
      })
    },