ElementUI校验规则
ElementUI封装了组件el-form来收集、校验和提交数据,其中的rules属性就是用来做数据校验的。ElementUI提供了一些常用的表单验证规则,我们可以直接使用该规则来实现数据校验。rules根据rules给出的规则会对prop中的值进行校验,当不满足要求时会弹出message相应的提示信息。
自定义规则调用
ElementUI提供的表单验证规则是有限的,可能无法满足我们项目的需求这时候就需要我们来自定义验证规则。我们在在data() {}中添加自定义的校验规则,然后在在data的return中通过validator引用校验规则。data() {return{}}中定义的rules要 中的 :rules 属性值相同,rules中的对象userName要与与 中的prop属性值相同。