如何在Vue2中实时监听表单变化

今天就跟大家聊聊有关如何在Vue2中实时监听表单变化，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

如下所示：

<template>
<section>
<el-dialog:title="formTitle":visible.sync="dialogFormVisible":before-close="cancel">
<el-form:model="form":rules="rules"ref="form">
</el-form>
<divslot="footer"class="dialog-footer">
<el-buttonsize="medium"type="primary"@click="addSubmit":loading="addLoading":disabled="unChange">确定</el-button>
</div>
</el-dialog>
</section>
</template>

<script>
exportdefault{
props:["dialogFormVisible","form","formTitle"],
data(){
return{
unChange:true,
preForm:JSON.parse(JSON.stringify(this.form))//深拷贝对象
};
},
watch:{
form:{
handler:function(nowVal,oldVal){
var$this=this;
for(letiin$this.form){
if(nowVal[i]!=$this.preForm[i]){
$this.unChange=false;
break;
}else{
$this.unChange=true;
}
}
},
deep:true
}
},
methods:{
addSubmit(){
var$this=this;
}
},
mounted(){
var$this=this;
}
};
</script>

看完上述内容，你们对如何在Vue2中实时监听表单变化有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注恰卡编程网行业资讯频道，感谢大家的支持。