TypeError: Cannot read properties of undefined (reading 'name') reactjs

Question

frontend code:

{

(opp||[]).map(opps=>{
    return(
        <div className="card OppCard">
        <div className="card-body" >
            <h4>{opps.title}</h4>
            <p><b>Author : {opps.postedBy.name}</b></p>
            <p style={{ "margin": "0px" }}>Description : {opps.desc}</p>
            <p style={{ "margin": "0px" }}>Location : {opps.location}</p>
            <p style={{ "margin": "0px" }}>Experience Required : {opps.experience}</p>
            <p style={{ "margin": "0px" }}>Last Date to Apply : {opps.ld}</p>
        </div>
    </div>
    )
}) 
}

At <p><b>Author : {opps.postedBy.name}</b></p> this line error occurs here is a pic attached for opps object:

you do opps.postedBy && opps.postedBy.name this will work

Ashish Kamble
– Ashish Kamble

2021-11-17 05:53:24 +00:00
Commented Nov 17, 2021 at 5:53 — Ashish Kamble
– Ashish Kamble, Commented Nov 17, 2021 at 5:53
@AshishKamble its undefined

Prateek Nandle
– Prateek Nandle

2021-11-17 05:53:58 +00:00
Commented Nov 17, 2021 at 5:53 — Prateek Nandle
– Prateek Nandle, Commented Nov 17, 2021 at 5:53
@AshishKamble thnx bro it worked, can u explain it though

Prateek Nandle
– Prateek Nandle

2021-11-17 05:55:10 +00:00
Commented Nov 17, 2021 at 5:55 — Prateek Nandle
– Prateek Nandle, Commented Nov 17, 2021 at 5:55

Ashish Kamble · Accepted Answer · 2021-11-17 05:56:18Z

1

whenever you try to access json object, check if it is undefined or not beffore calling method or accessing properrty replace this line,

<p><b>Author : {opps.postedBy.name}</b></p>

with this, instead, this will work because you are checking before accessing it, also when you try to .filter() or .map() first check if it is empty or not, if not empty then only call, else it will throw error

<p><b>Author : {opps.postedBy && opps.postedBy.name}</b></p>

answered Nov 17, 2021 at 5:56

Ashish Kamble

2,8254 gold badges23 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

TypeError: Cannot read properties of undefined (reading 'name') reactjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related