How to show dropdown in react js?

Question

API:-

{
    "No of Players": 2,
    "Players": [
        "A,C",
        "B,D"
    ]
}

can i show the C & D in the Dropdown Option i just want to show the dropdown after the comma

Like this:-

For A
    <select>
      <option selected>A</option>
      <option >C</option>
    </select> 
For B
    <select>
      <option selected>B</option>
      <option >D</option>
    </select> 

in image there is a but i want c & D in dropdown

Answer 1

First you need to split the options by delimiter i.e, in your case is comma(,). And then map the options to the array.

let obj ={
"No of Players": 2,
"Players": [
    "A,C",
    "B,D"
]
};
obj.PlayersOptions=obj.Players.map((item)=>item.split(','));

{obj.PlayersOptions.map((optionPlayer,index1)=>{
return <select key={index}>
 {optionPlayer.map((opt,index2)=>{
 return <option key={index2}>{opt}</option>
 }}
</select>
}}

Note: Please save the optionsArray after split in state as you want and then map them . As I have provided you rough idea.