vue+elementui常用到的輸入框驗證


1.驗證輸入框只能輸入正整數

  <el-input :disabled="mainId?true:false" @keyup.native="maxNumGetInput(index2)" v-model="item.maximumReceiveAllowed" style="width:10%"></el-input>

    maxNumGetInput(index) {
      this.formData[index].maximumReceiveAllowed = this.formData[index].maximumReceiveAllowed.replace(/[^\.\d]/g,'');
      this.formData[index].maximumReceiveAllowed = this.formData[index].maximumReceiveAllowed.replace('.',''); 
    },

2.金額輸入框且最多兩位小數驗證

  <el-input v-model="item.money" @input="inputChange(index2)" @change="getPrice()"></el-input>

    //監聽輸入框變化
    inputChange(index) {
      let self = this;
      self.formData[index].money = self.inputnum(self.formData[index].money)
    },

    // 輸入框最多兩位小數
    inputnum(val) {
      let num = val.replace(/[^\d.]/g, ""); //清除"數字"和"."以外的字符
      num = num.replace(/^\./g, ""); //驗證第一個字符是數字
      if (num.indexOf('.') == -1) { //小數點前留9位
        if (num.length > 9) {
          num = num.slice(0, 9);
        }
      } else {
        if (num.split('.')[0].length > 9) {
          num = num.split('.')[0].slice(0, 9) + '.' + num.split('.')[1];
        }
      }
      num = num.replace(/\.{2,}/g, ""); //只保留第一個, 清除多余的
      num = num.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
      num = num.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能輸入兩個小數
      return num
    },

 


免責聲明!

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



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