Reactjs react js render函数中的状态为空

我是新手。问题在于，当在menuitem中设置状态值并访问它们时，会出现空白，而手动设置该值效果良好。 这是我的代码片段

    //class definition
        class DowntimeAcknowledgeComment extends React.Component{
         constructor(props){
                super(props);
         this.state = {
                    comment: '',
                    startTime : Datetime.moment(),
                    endTime   : Datetime.moment().add(2, 'h'),
                    ...
        };
         //functon binding
        this.handleChange = this.handleChange.bind(this);
        }
        //handle change function
        handleChange(event, index, value){
                        this.setState({value: value});
            }

//render function
     render(){

        <div className="inline-block ">
                          <div className="width-80px margin-4px">Downtime for:</div>
                            <MuiThemeProvider >
                                <SelectField  value={this.state.value}  onChange={this.handleChange} >
                                      <MenuItem defaultValue={this.state.endTime} primaryText="2 Hours" />
                                      <MenuItem value={this.state.startTime} primaryText="8 Hours" />
                                      <MenuItem value="manual" primaryText="Manual"/>
                                </ SelectField>
                                </ MuiThemeProvider>

    <p>hello there {this.state.startTime}</p>
                    </div>

//类定义
类DowntimeAcknowledgeComment扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
评论：“”，
startTime:Datetime.moment（），
endTime:Datetime.moment（）.add（2，'h'），
...
};
//函数绑定
this.handleChange=this.handleChange.bind（this）；
}
//手柄切换功能
handleChange（事件、索引、值）{
this.setState（{value:value}）；
}
//渲染功能
render（）{
停机时间：
你好{这个州，开始时间}

defaultValue

在物料界面

SelectField

将其更改为

值

<MenuItem value={this.state.endTime} primaryText="2 Hours" />

---

希望这将有助于

您的事件处理程序接受两个它不会接收的额外参数，因为事件处理程序（包括react'）只接收一个参数，即事件对象

您仍然可以从该事件对象获取

值

信息，如下所示：

handleChange(event) {
  this.setState({ value: event.target.value });
}

---

这恰好是模仿。

根据文档，

SelectField

没有

defaultValue

属性，而是使用

value

<SelectField  value={this.state.value}  onChange={this.handleChange} >
    <MenuItem value={this.state.endTime} primaryText="2 Hours" />
    <MenuItem value={this.state.startTime} primaryText="8 Hours" />
    <MenuItem value="manual" primaryText="Manual"/>
</ SelectField>

您的

handleChange

功能应该是：

handleChange = (event, index, value) => this.setState({value});

---

使用arrow函数。

您是否尝试过

this.setState（{value:event.target.value}）

？尝试将“index”、“event”和“value”的值记录到控制台，并确保您正在分配所需的值。@SachiTekina您的建议似乎有效，但默认值={this.state.endTime}仍然是未定义的：/@RohitKumar您可以在状态中设置它。它是未定义的，因为它是在一个

onChange

事件中触发的。@SachiTekina您能告诉我怎么做吗？npm:'2.14.7'，节点：'4.2.2'，模块构建失败：语法错误：意外标记（183:13）>183 | handleChange=（事件，索引，值）=>this.setState（{value}）；

this.state = {
  comment: '',
  startTime: Datetime.moment(),
  endTime: Datetime.moment().add(2, 'h'),
  value: Datetime.moment().add(2, 'h')
}

handleChange = (event, index, value) => this.setState({value});