美文网首页Vue
表单验证 this.$refs[formName].valida

表单验证 this.$refs[formName].valida

作者: 记录学习生活 | 来源:发表于2018-11-11 16:09 被阅读2831次

vue结合element-ui的表单验证

1.使用此方法前检查prop一定必须要写在上面,写在里面的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>

数字类型的验证需要在 v-model 处加上 .number 的修饰符,这是 Vue 自身提供的用于将绑定值转化为 number 类型的修饰符

2.el-form rules,model属性绑定,ref标识

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() 方式不识别。需要使用: this.$refs.formName.validate()

相关文章

网友评论

    本文标题:表单验证 this.$refs[formName].valida

    本文链接:https://www.haomeiwen.com/subject/nngoxqtx.html