Element-UI如何自定义表单校验规则
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
自定义表单校验规则如下:
- 下面输入框
<el-form-item label="账号" :label-width="formLabelWidth" prop="codeName">
<el-input v-model="addDate.codeName" auto-complete="off"></el-input>
</el-form-item>
- 在data中添加校验规则
data () {
// 添加学生账号的正则
let validcodeName=(rule,value,callback)=>{
let reg=/[0-9a-zA-Z]{4,9}/
if(!reg.test(value)){callback(new Error('账号必须是由4-9位数字和字母组合'))
}else{
callback()
}
};
}
- 在return中rules里如下:
codeName:[
{required:true,message:'请输入账号',trigger:'blur'},
{validator:validcodeName,trigger:'blur'}
],
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45
6 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 6 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)