vue項目,動態計算倆個input的值並且賦值給另外的input


  • 在一個表單里可能有這種情況:輸入數量金額等,自動計算和或者乘積,提交表單的時候一起提交,可以在計算屬性里將值綁定
  • 大致效果:
  • 好了上代碼
// 在計算屬性
computed:{
    sum(){
     return parseFloat(this.addAcceptForm.number) * parseFloat(this.addAcceptForm.unitPrice) || 0
    }
  },
// dom結構:
<el-form :inline="true" :rules="addrules" :model="addAcceptForm" ref="addAcceptForm">
  <el-form-item label="數量:" prop="number">
          <el-input v-model="addAcceptForm.number"></el-input>
        </el-form-item>
        <el-form-item label="單價:" prop="unitPrice">
          <el-input v-model="addAcceptForm.unitPrice"></el-input>
        </el-form-item>
        <el-form-item label="金額:">
          <el-input v-model="sum" disabled=""></el-input>
        </el-form-item>
// 提交的時候我是這樣處理sum值的
submitAddAccept() {
      this.$refs["addAcceptForm"].validate(valid => {
        if (valid) {
          const form = this.addAcceptForm;
          form.money = this.sum  // 直接將計算結果賦值
          this.addActLoading = true;
          addData("/rear/acceptance/save", form)
  • 菜鳥一枚,歡迎大佬指點~~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM