DEV Community

loading...

Complex app w/ React

manuelalonge profile image Manuel Alonge ・1 min read

Hi,

I am currently working on a tutorial web app with React. Everything seems ok, but I receive an error at the src/Profile.js file. Link to the repo is here: https://github.com/manuelalonge/complex-app

The error is basically telling me what you see below but I am not really sure what I am doing wrong:

TypeError: Cannot read property 'postCount' of undefined
Profile
C:/wamp64/www/complex-app/src/Profile.js:39
36 |
37 |
38 |

39 |
| ^ 40 | Posts: {profileData.counts.postCount}
41 |

42 |

Discussion (4)

pic
Editor guide
Collapse
equimper profile image
Emanuel Quimper

That mean profileData.counts is undefined so you can’t access a key on an undefined type

github.com/manuelalonge/complex-ap... What do axios return here. If you setState and overrides everything make sure the backend response have the shape you want

Collapse
manuelalonge profile image
Manuel Alonge Author

I understood partly what you want to say, I am just not sure how to fix this. I am using MONGODB for the first time. Should I probably change the users section of the database?

Collapse
manuelalonge profile image
Manuel Alonge Author

I solved my issue, it was a stupid typo in the Main.js file, but thanks a lot for your support :)

Collapse
zoedreams profile image
☮️✝️☪️🕉☸️✡️☯️

profileData or counts is undefined or null. Its a good practice to get into not chaining properties like that unless you're using ECMA7+ which does automatic inline null checks.

Glad you solved it. After reviewing the code i would recommend putting the stuff that sets the profileData into its own function and make sure to use a try catch to throw and error or something. This would make your code more extensible for unit testing.

gl;hc;