先看一下我遇到的问题
这四项我配置了必填的规则
但是点击保存,即使我啥都没填也给通过了
反而我填了信息提示我信息未填写:
造成这种现象的原因也很简单,就是忘记给el-form加model属性了
<el-form ref="ruleFormRef" :model="editStaff" :rules="rules" label-width="100px">
添加后就会恢复正常
总结:使用el-form组件的校验时需要配置
<el-form>的配置属性:
ref(指定组件唯一标识),model(表单数据对象),rules(校验规则对象)
<el-form-item>的配置属性:
prop(标识表单项的字段名)
prop属性的作用是在表单校验时,根据字段名来匹配需要校验的表单项。prop属性的值应该与表单数据对象中的字段名相对应。