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)
    },