Skip to content

Promise state of formRef.value.validate() is always rejected, errorFields is 0, and outOfDate is true when using form component during form validation #7852

Closed
@wangshilin123

Description

@wangshilin123
  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.2.5

Environment

win11,Chrome128.0.6613.138,vue@3.5.6

Reproduction link

Edit on CodeSandbox

Steps to reproduce

<a-form
ref="formRef"
:model="formState"
:rules="formRules"
@submit.prevent="handleSubmit"
class="login-form"

forget-password
登录

import { reactive, ref } from 'vue'
const formRef = ref()
const formRules = {
username: [{ required: true, message: 'username', trigger: 'blur' }],
password: [{ required: true, message: 'password', trigger: 'blur' }],
}

const handleSubmit = async () => {
try {
await formRef.value.validate()
....}
catch (errors) {
console.error(errors)
}
}

What is expected?

It should be "fulfilled" in the promise state to proceed with the next code execution.

What is actually happening?

The promise state of formRef.value.validate() is always rejected, consistently caught by catch, causing the program to exit due to the error.


When I changed the component from a-form to Naive UI's n-form, the promise state was fulfilled, so I suspect it's a bug. Since I'm new to learning Vue, I don't know how to resolve it.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions