Array.map inside Array.map is not working

Question

I am getting an array of object returned from Database.I want to map that array and inside that i want to map another array.But i am getting some error. If anyone knows please help out with this problem.

displayMovies(){
    if(!this.state.body) return ( <h2> Loading.... </h2>)
    else{

        return this.state.body.map((data) => {
            return(
                <div key={data._id}>
                    <li> {data.name} </li>
                    <ul>
                        {
                            return data.map((cast) => {
                                return <li> cast.name </li>
                            })
                        }
                    </ul>
                </div>
            )
        })
    }
}

Data response

You don't need another return. You are in the middle of another return statement. — Yury Tarabanko
– Yury Tarabanko, Commented May 29, 2018 at 18:09

Nishant Dixit · Accepted Answer · 2018-05-29 18:24:55Z

1

You are not in any function inside nested loop so you do not need to return any thing Replace

 return data.map((cast) => {

to

data.map((cast) => {

and add apply map function on cast property of data

displayMovies(){
    if(!this.state.body) return ( <h2> Loading.... </h2>)
    else{

        return this.state.body.map((data) => {
            return(
                <div key={data._id}>
                    <li> {data.name} </li>
                    <ul>
                        {
                            data.cast.map((cast) => {
                                return <li> {cast.name} </li>
                            })
                        }
                    </ul>
                </div>
            )
        })
    }
}

edited May 29, 2018 at 18:24

answered May 29, 2018 at 18:11

Nishant Dixit

5,5125 gold badges22 silver badges32 bronze badges

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

7 Comments

abankitbaid Over a year ago

i tried that and its saying data.map() is not a function

Nishant Dixit Over a year ago

One more thing you are accessing {data.name} name in data so how could you use this as array?

Nishant Dixit Over a year ago

I thing you are missing some property between data and map which should be a array data.'property'.map

abankitbaid Over a year ago

I just added the image of response, if that helps

Nishant Dixit Over a year ago

I just updated my answer check now You are missing caste property before map like this data.caste.map

|

user9683328 · Accepted Answer · 2018-05-29 19:35:57Z

0

Your first map function returns an Object. Objects don't have map function use a for in loop instead, inside the loop, check if the property is an object. Replace second map with something like this :

for (const key in object) {
  if (object.hasOwnProperty(key) && typeof(object[key]=='object') {
    // do something with object[key].name 
  }
}

answered May 29, 2018 at 19:35

user9683328

16

Collectives™ on Stack Overflow

Array.map inside Array.map is not working

2 Answers 2

7 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related