diff --git a/packages/components/form/src/form-item.vue b/packages/components/form/src/form-item.vue index 0f2282dbdb..2fb7b997bf 100644 --- a/packages/components/form/src/form-item.vue +++ b/packages/components/form/src/form-item.vue @@ -177,8 +177,14 @@ const fieldValue = computed(() => { return getProp(model, props.prop).value }) -const _rules = computed(() => { - const rules: FormItemRule[] = props.rules ? ensureArray(props.rules) : [] +const normalizedRules = computed(() => { + const { required } = props + + const rules: FormItemRule[] = [] + + if (props.rules) { + rules.push(...ensureArray(props.rules)) + } const formRules = formContext?.rules if (formRules && props.prop) { @@ -191,17 +197,28 @@ const _rules = computed(() => { } } - if (props.required !== undefined) { - rules.push({ required: !!props.required }) + if (required !== undefined) { + const requiredRules = rules + .map((rule, i) => [rule, i] as const) + .filter(([rule]) => Object.keys(rule).includes('required')) + + if (requiredRules.length > 0) { + for (const [rule, i] of requiredRules) { + if (rule.required === required) continue + rules[i] = { ...rule, required } + } + } else { + rules.push({ required }) + } } return rules }) -const validateEnabled = computed(() => _rules.value.length > 0) +const validateEnabled = computed(() => normalizedRules.value.length > 0) const getFilteredRule = (trigger: string) => { - const rules = _rules.value + const rules = normalizedRules.value return ( rules .filter((rule) => { @@ -219,7 +236,7 @@ const getFilteredRule = (trigger: string) => { } const isRequired = computed(() => - _rules.value.some((rule) => rule.required === true) + normalizedRules.value.some((rule) => rule.required) ) const shouldShowError = computed(