populate select option in reactjs

Question

I am trying to populate a dropdown select option in ReactJS from an API but after several attempts instead of getting the values that I want, I got only a single string with all the values concatenated. I tried to format the JSON file in different ways but without any results.

https://codesandbox.io/s/populate-select-option-fu5gd?fontsize=14

Fardenz · Accepted Answer · 2019-07-15 16:04:39Z

0

I have changed your iterator for this:

    <select>
      {this.state.colours[1]?
        this.state.colours[1].color.map(item => {
        return <option>{item}</option>;
      })
    : <option>{''}</option>
    }
    </select>

Here is the complete codesandbox code.

answered Jul 15, 2019 at 16:04

Fardenz

1035 bronze badges

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

2 Comments

Banjer71 Over a year ago

Great thank you. Why do you use the condition with this.state.colours[1] ? and why this.state.colours[1].color doesn't work without the conditions? I tried that actually and I don't get why the conditions it is necessary to make it work?

Fardenz Over a year ago

@Banjer71 with that condition we check that the object is not undefined, so we can get the color array and map it.

Collectives™ on Stack Overflow

populate select option in reactjs

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related