场景再现:
在使用 form 表单的时候,一般都需要对表单元素进行验证,错误就出现在了这里,除了配置的错误信息,还会出现一个 英文校验提示,如下图:
解决方案
出现的原因是在el-form-item中使用了required属性,同时又用rules自定义了表单验证规则。
这时候如果需要设置必填项,此时的 require 需要配置在 el-input 中,或者直接配置在 rule 中。
// 错误示例,required 定义在了 el-form-item
<el-form-itemlabel="名称"prop="name"required><el-inputv-model="form.menuName":placeholder="'请输入名称'"maxlength="30"/></el-form-item>
// 正确写法,写在 el-input中
<el-form-itemlabel="名称"prop="name"><el-inputv-model="form.menuName":placeholder="'请输入名称'"maxlength="30"required/></el-form-item>
或者在 rule 中配置:
rules: [menuName: [{ required: true, validator: validateMenuName, trigger: "blur" }],
]