Tony
Tony

Reputation: 111

React not supporting map method

Following react.js tutorial I've got an error: Uncaught TypeError: Cannot read property 'map' of undefined.

I have a state like this :

this.state = {
      input: '',
      array1:[{name:"john"}, {name:"Tom"}, {name:"Walt"}, {name:"Peter"}]
}

and shared this as props to ResponseList component

<ResponseList apiRes = {this.state.array1} />

In the ResponseList I can't map through the array1

const ResponseList = ({ array1 }) => {
  return(
    <div>
      {
        array1.map((data,x) => data.name)
      }
    </div>
  )
}

Upvotes: 1

Views: 63

Answers (2)

Or Assayag
Or Assayag

Reputation: 6336

You simply can change the component to:

<ResponseList array1={this.state.array1} />

Upvotes: 1

wangdev87
wangdev87

Reputation: 8751

You should use apiRes as a props param, not array1. Make the name same.

const ResponseList = ({ apiRes }) => {
  return(
    <div>
      {
        apiRes.map((data,x) => data.name)
      }
    </div>
  )
}

Upvotes: 1

Related Questions