Vue 表单只提交修改过的部分

1、页面效果

2、实现

1.修改回显

注意： 在this.reset() 方法中每次清空 diffData

this.diffData = {};

2.声明，method

data() {
     return {
        ……  之前的数据不变
        form:  null,  //记录设备原始数据
        diffData: null,  //记录修改过的值
    }
},
 // 比较数据 method
  diffDevinfo() {
      for(let k in  this.rawDev) {
        if(this.rawDev[k]  !=  this.form[k]) {
            if (!this.diffData) {
                this.diffData = {};
            }
            this.diffData[k] = this.form[k];
        }
      }
     },

3.提交方法时调用

submitForm: function() {
 	this.diffDevinfo();
    if(!this.diffData) {
       console.log("未修改数据不提交")
       return true;
     }
     // TODO:: axios 提交数据
}