Reactjs / SemanticUi добавить условие в карте - PullRequest
Новая
       18

Reactjs / SemanticUi добавить условие в карте

1 голос
/ 19 сентября 2019

Я хочу добавить if условие внутри map функции, но безуспешно: 

const CityOptions = Data.CityData.map((state, index) => ({
    key: index,
    text: state.name,
    value: state.id,
}));

render(){
return(
<Dropdown
   id="City"
   search selection
   options={CityOptions}
></Dropdown>
}
}

Я пытался: 

 <Dropdown
     id="City"
     search selection
 >
     {Data.CityData.map((v,i) => {
         if(v.pid === this.state.cityValue){
             return (
                 <option key={i} value={v.id}>{v.name}</option>
             )
         }
         return true
     })}
 </Dropdown>

Ошибка:

React.Children. Ожидается получение только одного дочернего элемента React.

И также: 

<Dropdown
   id="City"
   search selection
   options={CityOptions.pid === this.state.cityValue ? CityOptions : null}
/>

Результат:

Нет данных

1 Ответ

2 голосов
/ 19 сентября 2019

Вы можете filter сначала 

Data.CityData.filter(x => x.pid === this.state.cityValue).map((v,i)  =>{
    return <option key={i} value={v.id}>{v.name}</option>
})

В соответствии с Документами семантического интерфейса пользователя options является array из objects по шаблону { text: '', value: '' }, поэтому вынужно передать как 

const CityOptions = Data.CityData.filter(x => x.pid === this.state.cityValue).map((v,i)  =>{
    return{
        key: v.id,
        value: v.id,
        text: v.text
    }
})
...