這篇文章主要為大家展示了“如何解決iview表單驗證的問題”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“如何解決iview表單驗證的問題”這篇文章吧。

創(chuàng)新互聯(lián)長期為上1000+客戶提供的網站建設服務，團隊從業(yè)經驗10年，關注不同地域、不同群體，并針對不同對象提供差異化的產品和服務；打造開放共贏平臺，與合作伙伴共同營造健康的互聯(lián)網生態(tài)環(huán)境。為吉木薩爾企業(yè)提供專業(yè)的成都網站建設、成都網站制作，吉木薩爾網站改版等技術服務。擁有10多年豐富建站經驗和眾多成功案例,為您定制開發(fā)。

iview表單驗證的步驟：

第一步：給 Form 設置屬性 rules   :rules
第二步：同時給需要驗證的每個 FormItem 設置屬性 prop 指向對應字段即可 prop=”“
第三步：注意：Form標簽里面是  :model
第四步：注意：在Form標簽里面必須添加  ref,相當于id,在此范圍內的表單驗證有效
第五步：在操作保存按鈕時，添加方法，對整個表單進行校驗，參數(shù)為檢驗完的回調，會返回一個 Boolean 表示成功與失敗。

  
    
      
    
    //data里面，寫驗證
    ruleValidate: {
      contractNo:[
        { required: true, message: '合同編號不能為空', trigger: 'blur' },
      ],
    }
    //methods里面，寫方法
    addChange(name){
       this.$refs[name].validate(valid => {
         if (valid) {
         }
       }); 
  

iview進行表單驗證select時候驗證失敗的問題：

用iview自帶的表單驗證select標簽的時候，一直驗證不通過，因為iview默認校驗數(shù)據(jù)類型為String，而我的select用的value是number類型的

ruleValidate: {
  customer:[
      { required: true, message: '客戶名稱不能為空', trigger: 'blur',type:'number'},
    ], 
   }

iview進行表單驗證時間日期驗證失敗的問題：

和下拉框一樣，日期的類型是data

 ruleValidate: {
  advance:[
      { required: true, message: '預送達時間不能為空', trigger: 'change' ,type: 'date'},
    ],
   }

iview進行多重驗證的寫法：

多重驗證包括第一要驗不能為空，第二要驗證限制的一些長度，寫正則表達式等

  ruleValidate: {
       goodsNum: [
           { required: true, message: '數(shù)量不能為空', trigger: 'blur' },
           { type: 'string',pattern:/^(([1-9]\d{0,3})|0)(\.\d{0,2})?$/, message:'數(shù)量應為正浮點數(shù)且不超過9999.99', trigger:'blur'},
            ],
   }

以上是“如何解決iview表單驗證的問題”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！