问题
表单校验是否必填,会给表单使用 rules
属性,传入校验规则,如下所示:
<el-form
:model="form"
:rules="rules"
>
</el-form>
如果是必填的,则在校验规则中添加 required: true
,如下所示。
data() {
return {
rules: {
pid: [
{
required: true,
message: "请选择上级节点",
trigger: ["blur", "change"],
},
],
},
};
},
并且表单项前会有星号提示必填:
如果在某些情况下才必填,则校验规则中可传入校验函数,如下所示:
data() {
var validateMajor = (rule, value, callback) => {
if (this.form.type == 4 && !value) {
callback(new Error(`请选择专业`));
} else {
callback();
}
};
return {
rules: {
major: [{ validator: validateMajor, trigger: ["blur", "change"] }],
},
};
},
但是上述代码不会给表单项前添加星号。
解决
给表单项添加 required
属性,则会添加星号。
如下所示,表示只在满足条件时才显示星号:
<el-form-item
label="专业"
prop="major"
v-show="form.type == 4"
:required="form.type == 4"
>
</el-form-item>
参考链接
element form如何在 label 前面添加必填 红星 ※而不加验证
标签:给表,单项,必填,星号,校验,添加 From: https://www.cnblogs.com/shayloyuki/p/18044767