4

As the question is, I need to set error message retrieved from the backend (laravel) and set it on every field if there is an error. The structure may look like this:

{
  'errors': {
     'email' : ['The Email field is required'],
     'password' : ['The Password field is required'] 
  }
}

In vuetify, I just set in the prop error-messages in one of the form input component (error-messages=data.errors.email then it picked up automatically the first one). The question is, how to do like this in ant-design-vue 3 ? Couldn't find any. I tried this but I don't want to use createForm since I already use form from inertia. Also tried this too but I barely to understand that. Now I'm stuck, I'm hoping someone could help me, thanks :(.

Nathan Bryan
  • 65
  • 3

1 Answers1

0

I have struggled for some time but finally found the solution that worked for me

<Form.Item
  name="email"
  label="Email"
  :rules="[
    { required: true, message: 'Please input your email' },
    { type: 'email', message: 'Incorrect email' }
  ]"
  :validateStatus="errors.email ? 'error' : undefined"
  :help="errors.email || undefined"
>
  <Input v-model:value="form.email" />
</Form.Item>
Klastios
  • 19
  • 1
  • 2
  • 1
    Welcome to Stack Overflow! Please read [answer] and [edit] your answer to contain an explanation as to why this code would actually solve the problem at hand. Always remember that you're not only solving the problem, but are also educating the OP and any future readers of this post. – Adriaan Feb 22 '23 at 13:45