TypeError: Cannot read property 'map' of undefined : object having list of objects

Question

I'm trying to map data using below json format. An object having list of objects.

'''{"pki_user_id":1234,"vc_username":null,"vc_password":null,"vc_name":"Muhammad","vc_email":"[email protected]","b_isreset":false,"b_timeout":0,"_RoleDto":[{"pki_role_id":30019,"vc_rolename":"SuperUser","vc_roledesc":"Super User","vc_type":null,"i_group":0,"_MenuDto":null},{"pki_role_id":20015,"vc_rolename":"COMADM","vc_roledesc":"Competency Admin","vc_type":null,"i_group":0,"_MenuDto":null},{"pki_role_id":2,"vc_rolename":"IT","vc_roledesc":"IT","vc_type":null,"i_group":0,"_MenuDto":null},{"pki_role_id":3,"vc_rolename":"TAA","vc_roledesc":"Time Attendance Administrator","vc_type":null,"i_group":0,"_MenuDto":null}]}'''

This is how I'm retrieving data:

        {props.LoginDto.vc_email}

        {props.LoginDto._RoleDto.map((record,i) => (

          <div key = {i}> {record.pki_role_id}</div>
        ))}

      </div>

Every time I'm getting this error. I'using react redux to receive props data.

If the array result is coming from an API maybe add null check as props.LoginDto._RoleDto && props.LoginDto._RoleDto.map(). — norbitrial
– norbitrial, Commented May 31, 2020 at 12:42
Yes, it works {props.LoginDto._RoleDto && props.LoginDto._RoleDto.map((record,i) — Muhammad Bilal
– Muhammad Bilal, Commented May 31, 2020 at 13:15

Akhilesh · Accepted Answer · 2020-05-31 13:12:06Z

1

Add a null check like this:

{props.LoginDto && props.LoginDto.vc_email}

        {props.LoginDto && props.LoginDto._RoleDto && !!props.LoginDto._RoleDto.length && props.LoginDto._RoleDto.map((record,i) => (

          <div key = {i}> {record.pki_role_id}</div>
        ))}

      </div>

edited May 31, 2020 at 13:12

answered May 31, 2020 at 12:49

Akhilesh

5441 gold badge10 silver badges18 bronze badges

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

6 Comments

Muhammad Bilal Over a year ago

{props.LoginDto.vc_email} is working fine. When I try to retrieve list of Roles giving undefined error

Muhammad Bilal Over a year ago

after removing code, when I check console log it shows complete data console.log(props.LoginDto) console.log(JSON.stringify(props.LoginDto._RoleDto))

Muhammad Bilal Over a year ago

When I added that piece of code then error comes :TypeError: Cannot read property 'length' of undefined and console log object values are undefined. Object Sidebar.js:227 undefined

Akhilesh Over a year ago

Try adding a null check ...LoginDto && props.LoginDto._RoleDto && like this. I have updated the answer

Muhammad Bilal Over a year ago

yes it works {props.LoginDto._RoleDto && props.LoginDto._RoleDto.map((record,i)

|

Uma Rani · Accepted Answer · 2022-01-23 14:00:46Z

0

{props.LoginDto && props.LoginDto.vc_email}

    {props.LoginDto && props.LoginDto._RoleDto && !!props.LoginDto._RoleDto.length && props.LoginDto._RoleDto.map((record,i) => (

      <div key = {i}> {record.pki_role_id}</div>
    ))}

  </div>

answered Jan 23, 2022 at 14:00

Uma Rani

1

Collectives™ on Stack Overflow

TypeError: Cannot read property 'map' of undefined : object having list of objects

2 Answers 2

6 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related