Can't use Object.entries with array index structure in ReactJs

Question

I am having trouble maping through an array, i am using Object.entries to map the data, find below the example of the json structure. here is what i have tried but i get errors, i know the bath is not correct.

{
  Object.entries(this.props.optionData.steps).map((t, k) => (
    <option onClick={(e) => this.optionSelectHandle(t, k)} key={k} value={t[0]}>
      {t[1]}
    </option>
  ));
}


{
    "steps": [{
            "step_num": 1,
            "description": "Description"
        },
        {
            "step_num": 2,
            "description": "Description",
            "uncommon_field": "some data"
        }
    ]
}

Object.entries is only for objects. It returns an array you can map over. However, when you've already got an array, you can simply map over it immediately. — Soviut
– Soviut, Commented May 23, 2022 at 20:47

Soviut · Accepted Answer · 2022-05-23 20:44:37Z

3

you could simply use the map function on steps like such:

{
  this.props.optionData.steps.map(step => (
    <option onClick={(e) => this.optionSelectHandle(e)} key={step.step_num} value={step.step_num}>
      {step.description}
    </option>
  ));
}

as it is already an array

edited May 23, 2022 at 20:44

Soviut

92.2k53 gold badges210 silver badges285 bronze badges

answered May 23, 2022 at 20:43

Darren

5986 silver badges13 bronze badges

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

Collectives™ on Stack Overflow

Can't use Object.entries with array index structure in 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