站长资源网络编程
Vue2实时监听表单变化的示例讲解
简介如下所示：
如下所示：
<template>
<section>
<el-dialog :title="formTitle" :visible.sync="dialogFormVisible" :before-close="cancel">
<el-form :model="form" :rules="rules" ref="form">
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="medium" type="primary" @click="addSubmit" :loading="addLoading" :disabled="unChange">确 定</el-button>
</div>
</el-dialog>
</section>
</template>
<script>
export default {
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(let i in $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实时监听表单变化的示例讲解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。
上一篇：vue中rem的配置的方法示例
下一篇：vue-swiper的使用教程