Vue 有多个input框里初始会带信息过来，怎么在修改这个初始信息之后，能收集到被修改的初始信息，未修改的初始信息不收集？

Question

问题描述

做的一个页面，页面初始化有一组input框里会带初始信息过来，比如
以下代码所见，假如我只修改了公司简称，这时想记录下修改的项，存在一个对象里，其他未变化的不记录

相关代码

<el-form-item label="公司名称" prop="name">
   <el-input size="medium" v-model="companyForm.name"></el-input>
</el-form-item>

<el-form-item label="公司简称">
   <el-input size="medium" v-model="companyForm.reduceName"></el-input>
</el-form-item>

<el-form-item label="公司电话" prop="phone">
    <el-input type="text" size="medium" v-model="companyForm.phone"></el-input>
    <span class="stuff-hering">手机号码或者固定电话[phone]格式)</span>
</el-form-item>

试过watch，不知道是不是方式不对，没成功，请大家给我点思路

Answer 1

直接watch companyForm应该不行，应该遍历companyForm的key

 watch: {
        companyForm: function(val, oldVal) {
            // 遍历对比
        }
    }

或者你可以监听input的change事件

Answer 2

wacth监听每一个input里面的值 按理也是可以的
我提一个笨的思路

首先 你说的修改时啥？修改了，再改回成原来的叫修改吗


思路  
    你再存储到对象的时候  判断一下你input的值是不是和你通过后台获取到的初始值一样，一样的话不传呗，不一样再传