Cannot read property 'setValues' of undefined


I am still learning React and I am not sure why I am getting “Cannot read property ‘setValues’ of undefined” with my code. Some of the files are from a template I downloaded.

I have posted my code at CodeSandBox:

Any help is appreciated.

These errors often confuse people.

  const { setValues, data } = useData();

It is saying that when it tries to do it’s destructuring, what it’s trying to destructure from is undefined. So, the return value from useData must be undefined.

Hi Kevin,

I fixed some of the code but it is now giving me error that textField being undefined…

No, you (like a lot of people) are misreading that error:

Cannot read property ‘textField’ of undefined

It is not saying that textField is undefined, it’s saying that what you are trying to read it as a property of is undefined.

          <FormControl error={!!errors.textField}>

It is saying that errors is undefined and you are trying to access a property.

In JS, primitives can never have properties. Some of the primitives have object wrappers so if you try to access a property (or a method) then JS will wrap it in the object wrapper and check that - that is why you can access the length prop on a string, or various methods.

But in JS, undefined and null do not have object wrappers. If you try to access one of those, the app will throw and error. If nothing catches that error, it will bubble up the app until the app crashes.

Are you sure you are accessing errors properly? When I look in the docs, I see this usage, with a nested destructuring:

const { register, handleSubmit, formState: { errors } } = useForm();

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.