React object property has value but shows undefined on refresh

Viewed 37

I'm building a React app that get's it's data via API calls.

I have an array of objects that gets populated, but for some reason only 1 attribute in the objects is inaccessible only when the page is refreshed.

My account is new so unfortunately I cannot post pictures yet.

Code Populating

When I log the object I can see the property, "price", has a value. However, when I try to access it, it shows undefined.

Console.log code

Browser Log

Does anyone happen to know why this might be happening?

Thank you

1 Answers

First of all u should update state after dom rendered the use useState or componentDidMount(). After that if u want to dont get error u should check the value of your state for example below

<div>
   {
   
   arrayOfObjects ? arrayOfObjects.map(obj=>(
     
      <div>

       obj.propertyName

     </div>
 
   )) 
   
   }
</div>
Related