Как добавить первый вариант как вариант по умолчанию в выберите пользовательский интерфейс? - PullRequest
Новая
       18

Как добавить первый вариант как вариант по умолчанию в выберите пользовательский интерфейс?

0 голосов
/ 09 июня 2019

Я использую Material-UI Выберите для выпадающего списка.Я хочу установить первый вариант по умолчанию, выбранный при загрузке страницы.Однако я не могу найти какую-либо документацию. 

<Select

  open={open}
  className={classes.select}
  onClose={this.handleClose}
  onOpen={this.handleOpen}
  value={brand}
  onChange={event => this.handleChange(event)}
  name="brand"
  inputProps={inputProps}>

  {data.getBrands.map(brands => 
   <MenuItem key={brands.id} 
            value={brands.originalId} 
            id{brands.originalId}>{brands.name}
   </MenuItem>)}

</Select>

Я ожидаю, что раскрывающийся список будет содержать первый параметр в качестве значения по умолчанию при загрузке страницы в первый раз.

1 Ответ

0 голосов
/ 09 июня 2019

Единственный способ - присвоить первое значение data.getBrands переменной brand перед рендерингом компонента Select.Как то так: 

...
brand = data.getBrands.length > 0 ? data.getBrands[0].originalId : '';
...
<Select
  open={open}
  className={classes.select}
  onClose={this.handleClose}
  onOpen={this.handleOpen}
  value={brand} // this will select the first option after page load
  onChange={event => this.handleChange(event)}
  name="brand"
  inputProps={inputProps}>

  {data.getBrands.map(brands => 
   <MenuItem key={brands.id} 
            value={brands.originalId} 
            id{brands.originalId}>{brands.name}
   </MenuItem>)}
</Select>
...