Reactjs+MaterialUI:SelectField事件处理

我正试图建立我的网站的反应和手段。具体来说，我正在尝试用一个。它看起来很容易，但后来我被卡住了，因为我试图使它成为一个受控组件。我只是希望每当用户在下拉列表中选择一个项目时，该项目就成为select字段的值

呈现的“选择”字段类似于此字段，它是一个字符串数组：

<SelectField floatingLabelText="Website" onChange={(evt) => this.websiteDidChange(evt)} value={this.state.website} >
            {websites.map(function(w, index){
              return  <MenuItem key={index} label={w} value={w}>{w}</MenuItem>;
            })}
</SelectField>

---

首先，当我选择一个项目时，evt.target.value结果未定义。有人能看到我错过了什么吗？我应该使用事件中的其他属性吗？我无法从文档中真正理解它。

我自己找到了答案：onChange回调显然接收两个参数：事件和新选择的索引。因此，我更新了下面的代码，它可以正常工作：

websiteDidChange(newIndex) {
  this.setState({
    website: websites[newIndex]
  });
}

...

<SelectField floatingLabelText="Website" onChange={(evt, newIndex) => this.websiteDidChange(newIndex)} value={this.state.website} >
            {websites.map(function(w, index){
              return  <MenuItem key={index} label={w} value={w}>{w}</MenuItem>;
            })}
</SelectField>

---

显然，onChange函数将所选值作为第三个参数接收，因此您可以直接使用它。

是的，根据文档，第三个事件是有效负载值：

选择菜单项时激发的回调函数

签名：functionevent:object，key:number，payload:any=>void 事件：针对所选菜单项的触摸屏事件。关键： 所选菜单项的索引，如果“多个”为真，则为“未定义”。 有效负载：如果multiple为true，则菜单的值数组 菜单项的附加值（如果尚未选择或忽略） 它已被选中。否则，将显示菜单项的值

例如：

<SelectField
            value={this.props.someValue}
            onChange={(evt, key, payload)=>console.log(payload)}
        >

<SelectField
            value={this.props.someValue}
            onChange={(evt, key, payload)=>console.log(payload)}
        >