iview中的表單組件Input輸入框限制輸入內容方法


<Form ref="formInline" :model="formInline" :rules="ruleValidate" :label-width="100" :show-message="true">
  <FormItem label="供應商名稱" prop=" vendorName">
              <Input type="text" v-model="formInline.vendorName" style="width: 200px;" :disabled="inpDisabled"></Input>
  </FormItem>
</Form>
export default {
  data(){
         
//供應商編碼驗證
    const validateCode = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("供應商編碼不能為空"));
      } else if (!/^\d{5}$/.test(value)) {
        callback("請輸入5位純數字");
      } else {
        callback();
      }
    };
    //手機號驗證
    const validatePhone = (rule, value, callback) => {
      if (!value) {
        return callback();
      } else if (!/^1[345678]\d{9}$/.test(value)) {
        callback("手機號格式不正確");
      } else {
        callback();
      }
    };
    //電話號驗證
    const validatePhone1 = (rule, value, callback) => {
      if (!value) {
        return callback();
      } else if (!/^0\d{2,3}-\d{7,8}$$/.test(value)) {
        callback("請輸入區號-號碼格式");
      } else {
        callback();
      }
    };
    // 供應商名稱
    const  validateName1 = (rule, value, callback) => {
      if (!value) {
        return callback();
      } else if (!/^ +| +$/g.test(value)) {
        callback("不支持輸入空格");//中文
      } else {
        callback();
      }
    };
 retrun{
 
  
ruleValidate: {
         vendorCode: [
            { required: true, message: '供應商編碼不能為空', pattern: /.+/, trigger: 'blur' }
           { required: true, validator: validateCode, trigger: "blur" }
         ],
         vendorName: [
          {
            required: true,
            message: "供應商名稱不能為空",
            pattern: /.+/,
            trigger: "blur",
          },
          { required: true, validator:  validateName1, trigger: "blur" }
        ],
  cvenHand2: [{ validator: validatePhone, trigger: "blur" }],
        cvenPhone: [{ validator: validatePhone1, trigger: "blur" }]
  }
 
}
 
 
 
 
 
 
 
 
 
    
  }
}
 


免責聲明!

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



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