Get json value from array.map

Question

I am looping through my achievements props to display a series of divs:

const listItems = this.props.todo.achievements.map((achievement) =>
  <div className="cell" key={achievement.id}>
     {achievements[achievement.id].label}
  </div>
);`

How can I pull the label out of a json I'm importing from a local file?

{
 "achievements":[
  {
     "label":"one",
     "id":0
  },
  {
     "label":"two",
     "id":1
  },
  {
     "label":"three",
     "id":2
  },
  {
     "label":"four",
     "id":3
  },
  {
     "label":"five",
     "id":4
  }]
 }

In my root reducer I have my initial state which stores the achievement id.

If I output {achievement}, I only get the number. Should I set my intital state to store the label, rather than store it in a local json file?

const initialState = [
  {
    date: "Fri 1st",
    enjoyments: [1,2,3],
    achievements: [1,3,2],
    id: 0
  },
  {
    date: "Fri 2",
    enjoyments: [1,3,2],
    achievements: [1,3,2],
    id: 1
  },

Like @felix said, you should have access to the label property in the map callback, just wanted to point out that the "achievements" array is currently a typo in your json => "achievementa" — abhi
– abhi, Commented May 23, 2017 at 21:37

Felix Kling · Accepted Answer · 2017-05-23 21:22:14Z

1

achievement is already one of the objects in the array. You just have to access its label property:

{achievement.label}

Have a look at the following posts to learn more about JSON and objects (they are not the same):

answered May 23, 2017 at 21:22

Felix Kling

820k181 gold badges1.1k silver badges1.2k bronze badges

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

1 Comment

Bomber Over a year ago

I can only get the id not the label, do I need to change my json?

Collectives™ on Stack Overflow

Get json value from array.map

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related