如何在 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>

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

How to use Select in ReactJS, and creating its options with an Array

reactjs

material-ui