Is there a way to get all the error messages for a given form generically?

[jim-moody]

In my example, I have a reusable form that shows a list of error messages and the form can contain 25-30 different inputs with multiple validations so its very tedious to hand-write the path to each possible error message.

Is there a way to just map all the error messages and display them in a list something like this:
https://codesandbox.io/p/sandbox/friendly-williams-2g9c7p?file=%2Fsrc%2FApp.tsx%3A1%2C1-37%2C1

[Haschikeks]

Hey,

error is a Object. So you could use methods like Object.values(errors) to access all of them.

<ul>
  {Object.values(errors).map((error) => (
    <li>{error.message}</li>
  ))}
</ul>

[sneko]

Just note depending on your form it can have a structure of nested objects and nested arrays... so watch out! There is a risk of forgetting listing an error.

Associated discussion: https://github.com/orgs/react-hook-form/discussions/12527

[kcsujeet]

Just note depending on your form it can have a structure of nested objects and nested arrays... so watch out! There is a risk of forgetting listing an error.

Associated discussion: https://github.com/orgs/react-hook-form/discussions/12527

Is there a way to get all the errors of a particular field? .... Only the first one is returned at the moment.

[sneko]

@kcsujeet I don't think so since the message is typed as a string and not an array.