如何在 react-toolbox DropDown 中迭代数组答案

【问题标题】：how to iterate over an array in react-toolbox DropDown如何在 react-toolbox DropDown 中迭代数组
【发布时间】：2017-05-30 17:14:35
【问题描述】：

最初我在 reactjs 中使用简单的 html 选择框，我迭代了我的数组作为子元素中的道具

  <select onChange={this.getOccasion}>
  <option value="states">States</option>
  {
      this.props.holidays.map(function(holidays,i) {
      return <option key={i}
        value={holidays.state}>{holidays.state}</option>;
    })
  }
</select>

但我不知道在 react-toolbox Dropdown 中迭代我的数组的位置。我尝试关注

  <Dropdown
  auto
  onChange={this.getOccasion}
  source={this.props.holidays}
  value={this.props.holidays.state}
/>

【问题讨论】：

标签： react-toolbox

【解决方案1】：

您需要让下拉列表source 采用某种格式。

const countries = [
  { value: 'EN-gb', label: 'England' },
  { value: 'ES-es', label: 'Spain'},
  { value: 'TH-th', label: 'Thailand' },
  { value: 'EN-en', label: 'USA'}
];

检查 RT dropdown 组件。

所以，你可以这样做，

const holidays = this.props.holidays.map(holiday => ({
  value: holiday.state,
  label: holiday.state
}));

<Dropdown
  auto
  onChange={this.getOccasion}
  source={holidays}
  value={this.state.someVariable}
/>

【讨论】：