vue+elementui輸入框限制（只能輸入大於0的正整數（不能以0開頭））

方法封裝

limit.js

export default {

   /**
    * 只能輸入大於0的正整數（不能以0開頭）
    * @param {string} value
    * @returns {string | number} 返回空字符或數字
    */
   integerFn(value) {
     let reg = /[1-9]{1}[0-9]*$/;
     let strArray = value.split("");
     let newStrs = "";
     for (let i = 0; i < strArray.length; i++) {
       if (reg.test(strArray[i])) {
         newStrs += strArray[i];
       } else if (i > 0 && strArray[i] === "0") {
         newStrs += strArray[i];
       }
     }
     if (newStrs - 0 > 0) {
       return newStrs - 0;
     } else {
       return "";
     }
   },
} 

 

main.js

// 將限制函數文件綁定到vue原型上，供全局使用
import limit from "./api/limit.js";
Vue.prototype.$limit = limit;

 

組件使用

<el-input v-model="form.money" placeholder="請輸入充值金額" @input="(e) => (form.money = $limit.integerFn(e))"></el-input>