Vue监听表单变化
需求:当表单中未填写任何项时,提交按钮置灰,只要填写其中一项,则可点击按钮。<el-buttontype="primary":disabled="isButtonGray"@click="handleSave('ruleForm')">保存</el-button>data() {return {formItem: {...
·
需求:当表单中未填写任何项时,提交按钮置灰,只要填写其中一项,则可点击按钮。
<el-button type="primary" :disabled="isButtonGray" @click="handleSave('ruleForm')"> 保存 </el-button>
data() {
return {
formItem: {
commodityCode: null,
name: '',
price: ''
},
preForm: null
}
},
watch: {
resetData: function() {
this.$refs.ruleForm.resetFields()
},
formItem: {
handler:function(nowVal,oldVal){
var $this = this;
for(let i in $this.formItem){
if(nowVal[i] != $this.preForm[i]) {
$this.isButtonGray = false;
break;
}else {
$this.isButtonGray = true;
}
}
},
deep:true
}
},
mounted() {
this.preForm = Object.assign({}, this.formItem)
},
更多推荐
已为社区贡献2条内容
所有评论(0)