reactjs - 如何在 ReactJS 中使用 Select，并使用数组创建其选项

Question

我是 ReactJS 的新手。好吧，我只想解决这个问题，我不想从 React 中获得其他任何东西。在我已经构建的应用程序中，使用了 SelectField(Material-UI)，它不显示选定的值。除此之外，一切正常。这是标记:

<SelectField ref="device" selectedIndex={this.state.deviceIndex} displayMember="device_model" valueMember="device_id" menuItems={this.state.devices} onChange={this.onSelectDevice} style={{float:"left", marginTop:"5px", width:"300px"}} />

我想要两件事之一:
1. 要么用现有的 SelectField 组件解决我的问题，之后我将能够获得所选项目。或者
2. 分享使用简单的HTML Select的工作方法...

Answer 1

您必须将要显示为子项的菜单项传递给 SelectField 组件。使用内联映射表达式很容易做到这一点。

例子:

  <SelectField selectedIndex={this.state.deviceIndex}>
    {this.state.devices.map(device =>
      <MenuItem value={device.id} primaryText={device.name}/>
    )}
  </SelectField>