question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

useFieldArray.ts:37 --> error in dev

See original GitHub issue

Describe the bug I just migrated to react-hook-form version >=9.10, and my code is not working anymore, because of the line src/useFieldArray.ts:37

The reported error is: TypeError: Cannot use ‘in’ operator to search for ‘id’ in name1

  34 | ): Partial<ArrayField<TFieldArrayValues, TKeyName>>[] => {
  35 |   if (process.env.NODE_ENV !== 'production') {
  36 |     for (const value of values) {
> 37 |       if (!!value && keyName in value) {
  38 |         console.warn(
  39 |           `📋 useFieldArray fieldValues contain the keyName \`${keyName}\` which is reserved for use by useFieldArray. https://react-hook-form.com/api#useFieldArray`,
  40 |         );

I don’t quite understand why, but it applies the “in” operator on the array item, and not on the array itself. I suspect it comes from the form of my data which are structured as:

{
   "names":{
      "en":["name1", "name2", "name3"]
   }
}

I suspect that the code is now faulty because you expect to get “object” inside the array, but my data aren’t structure that way. can you fix the code to check first if “value” is of type object ?

Thanks in advance, Loic

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

16reactions
partiescommented, Dec 30, 2020

@bluebill1049 can we get an explanation as to why flat arrays aren’t supported? This seems like a pretty crucial feature…

Quick explanation of what I’m trying to do:

  • I’m building a bridge from a GraphQL schema to a react-hook-form (in short, auto-generating a form from a GraphQL schema).
  • Our schemas use lists of scalars such as string arrays, float arrays, etc. and we want these to be handled by react-hook-form.
  • Unfortunately, given this constraint of not supporting flat arrays we have to come up with some kind of workaround where we map our flat arrays into non-flat arrays with id/value combos.

Any advice on how to proceed?

0reactions
k-one-o-twocommented, Dec 27, 2021

Are there any plans to support flat arrays?

Read more comments on GitHub >

github_iconTop Results From Across the Web

React Hook Form - useFieldArray Errors object - Expo Snack
React Hook Form - useFieldArray Errors object. No description. Open with Expo Go. Open in editor. Need Expo? Don't have the Expo Go?...
Read more >
React hook form useFieldArray typescript error on input name
in v7, register() accepts a literal (an exact string value) instead of a string. So change your code to:
Read more >
React Hook Form - useFieldArray - YouTube
In this session, we are taking a look at the useFieldArray custom hook to manage your dynamic form fields.working example: ...
Read more >
useFieldArray - Simple React forms validation
useFieldArray ({ rules: { minLength: 4 } }). In case of validation error, the root property is appended to formState.errors?.fieldArray?.root of type ...
Read more >
React Hook Form - useFieldArray - Remove ERROR
A custom hook for working with Field Arrays (dynamic inputs). 0. 77.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found