element ui 给表单input输入框添加校验

①el-form  使用 :rules指定验证规则,使用:model指定表单对象

②el-form-item 使用:prop指定验证规则名称, 注意和 v-model名字保持一致

初始化表单对象自定义表单校验即可生效。代码如下:

      <el-form  :model="form" :rules="rules" ref="form" label-width="100px" >
        <el-form-item label="角色集名称" prop="setName">
          <el-input v-model="form.setName" placeholder="请输入角色集" ></el-input>
        </el-form-item>
      </el-form>
 return {
                form: {
                    setName:'',
                },
                //自定义 表单校验
                rules: {
                    setName: [
                        {
                            required: true,
                            message: '用户集名称不能为空!!',
                            trigger: 'blur'
                        }
                    ],
                },
}

 

© 版权声明
THE END
喜欢就支持以下吧
点赞0
分享
评论 抢沙发