Vue实现在两个input中分别输入数据,在第三个input中动态得出前两者的结果
https://blog.csdn.net/WhenTheWindBlows/article/details/87990745
<a-form-model-item ref="specialNum" label="特殊作业" prop="specialNum"> <a-input-number disabled="true" v-model="commonData.specialNum" :min="0" :precision="0" :formatter="limitNumber" :parser="limitNumber" @blur=" () => { $refs.specialNum.onFieldBlur() } " /> </a-form-model-item> <a-form-model-item ref="specialFireNum" label="特级动火作业" prop="specialFireNum"> <a-input-number :disabled="commonDisabled" v-model="commonData.specialFireNum" :min="0" :precision="0" :formatter="limitNumber" :parser="limitNumber" @blur=" () => { $refs.specialFireNum.onFieldBlur() } " /> </a-form-model-item> <a-form-model-item ref="oneFireNum" label="一级动火作业" prop="oneFireNum"> <a-input-number :disabled="commonDisabled" v-model="commonData.oneFireNum" :min="0" :precision="0" :formatter="limitNumber" :parser="limitNumber" @blur=" () => { $refs.oneFireNum.onFieldBlur() } " /> </a-form-model-item> <a-form-model-item ref="twoFireNum" label="二级动火作业" prop="twoFireNum"> <a-input-number :disabled="commonDisabled" v-model="commonData.twoFireNum" :min="0" :precision="0" :formatter="limitNumber" :parser="limitNumber" @blur=" () => { $refs.twoFireNum.onFieldBlur() } " /> </a-form-model-item> <a-form-model-item ref="spaceNum" label="受限空间作业" prop="spaceNum"> <a-input-number :disabled="commonDisabled" v-model="commonData.spaceNum" :min="0" :precision="0" :formatter="limitNumber" :parser="limitNumber" @blur=" () => { $refs.spaceNum.onFieldBlur() } " /> </a-form-model-item>
watch: {
'commonData.specialFireNum': function(val) {
this.commonData.specialNum =
Number(this.commonData.oneFireNum) +
Number(this.commonData.twoFireNum) +
Number(this.commonData.spaceNum) +
parseInt(val)
},
'commonData.oneFireNum': function(val) {
this.commonData.specialNum =
Number(this.commonData.specialFireNum) +
Number(this.commonData.twoFireNum) +
Number(this.commonData.spaceNum) +
parseInt(val)
},
'commonData.twoFireNum': function(val) {
this.commonData.specialNum =
Number(this.commonData.specialFireNum) +
Number(this.commonData.oneFireNum) +
Number(this.commonData.spaceNum) +
parseInt(val)
},
'commonData.spaceNum': function(val) {
this.commonData.specialNum =
Number(this.commonData.specialFireNum) +
Number(this.commonData.oneFireNum) +
Number(this.commonData.twoFireNum) +
parseInt(val)
},