方法使用前需了解:
來(lái)自”和“小編的小提示:
首先打印一下this.$refs[formName]靠柑,檢查是否拿到了正確的需要驗(yàn)證的form。
其次在拿到了正確的form后擦囊,檢查該form上添加的表單驗(yàn)證是否正確塞茅,需要注意的點(diǎn)有:
1.使用此方法前檢查prop一定必須要寫(xiě)在<el-form-item>上面,寫(xiě)在里面的input上或者其他任何地方都不行(el-form-item prop屬性綁定)
2.el-form rules震蒋,model屬性綁定茸塞,ref標(biāo)識(shí)
vue結(jié)合element-ui的表單驗(yàn)證
1.使用此方法前檢查prop一定必須要寫(xiě)在上面,寫(xiě)在里面的input上或者其他任何地方都不行
el-form-item prop屬性綁定)
<el-form-item label='' prop="prop">
<el-input type="number" v-model.number="amt" placeholder=""></el-input> </el-form-item>
數(shù)字類(lèi)型的驗(yàn)證需要在 v-model 處加上 .number 的修飾符查剖,
這是 Vue 自身提供的用于將綁定值轉(zhuǎn)化為 number 類(lèi)型的修飾符
2.el-form rules钾虐,model屬性綁定,
ref標(biāo)識(shí)this.$refs['formName'].validate((valid) => {
if (!valid) {
console.log(valid)
//do something
return false }else{
//do something
}
})
formName是form的ref屬性 //<el-form :model="modelInfo" :rules="rules" ref="formName">
如果 this.refs.formName.validate()