Javascript 在材质ui中使用getValue（）时，setState落后一步<；TextField/>；

我正在尝试通过单击“材质ui”获取文本字段中的值来更新我的状态。然而，在更新todo状态时，setState似乎总是落后一步。例如，如果我在第一轮输入'asdf'，this.state.todo为空（这是它初始化的内容）。然后输入“1234”。单击，我现在看到

this.state.todo

是“asdf”

问题1:我认为这可能与setState的“”有关，但不确定如何解决此问题

当我将onChange和value与一个普通的（非物质用户界面）输入字段一起使用时，一切都很好

问题2:所以我也很好奇为什么setState在material ui getValue（）案例中批处理该过程，而不是在输入中使用onChange/Value时

下面是这两个品种的代码

物料UI文本字段：

const Main = React.createClass({
  mixins: [ReactFire],
  childContextTypes: {
    muiTheme: React.PropTypes.object
  },

  getInitialState () {
    return {
      muiTheme: ThemeManager.getMuiTheme(LightRawTheme),
      todo: ''
    };
  },

  getChildContext() {
    return {
      muiTheme: this.state.muiTheme
    };
  },

  componentWillMount() {
    let newMuiTheme = ThemeManager.modifyRawThemePalette(this.state.muiTheme, {
      accent1Color: Colors.deepOrange500
    });

    this.setState({muiTheme: newMuiTheme});
    this.fb = new Firebase(rootUrl+'items/');
    this.bindAsArray(this.fb,'items');
  },

  render() {
    let containerStyle = {
      textAlign: 'center',
      paddingTop: '200px'
    };

    let standardActions = [
      { text: 'Okay' }
    ];

    return (
      <div>
        <AppBar
          title="Immaterial"
          iconClassNameRight="muidocs-icon-navigation-expand-more" />

        <div style={containerStyle}>
          <TextField
            hintText="Hint Text"
            ref="newTodo"
            />
          <Dialog
            title="Go get 'em Tiger!"
            actions={standardActions}
            ref="superSecretPasswordDialog">
            {this.state.todo}
          </Dialog>

          <h3>A journey of a thousand miles begins with a single step</h3>

          <RaisedButton label="Carpe Diem" primary={true} onTouchTap={this._handleTouchTap} />

        </div>
      </div>
    );
  },

  _handleTouchTap() {
    var todo = this.refs.newTodo.getValue()
    console.log(todo)
    this.setState({todo: todo});
    console.log(this.refs.newTodo.getValue())
    console.log(this.state.todo)
    // this.firebaseRefs.items.push({
    //   todo: this.state.todo
    // });
    //this.refs.superSecretPasswordDialog.show();
    //this.refs.newTodo.clearValue();
  }

const Main=React.createClass({
混合：[反应火]，
childContextTypes：{
muiTheme:React.PropTypes.object
},
getInitialState（）{
返回{
博物馆：博物馆管理者。博物馆（光之主题），
待办事项：“”
};
},
getChildContext（）{
返回{
博物馆：这个。州。博物馆
};
},
组件willmount（）{
让newMuiTheme=manager.modifyrawthemepalete（this.state.muiTheme{
Accent1颜色：颜色。深橙色500
});
this.setState（{muiTheme:newMuiTheme}）；
this.fb=newfirebase（rootUrl+'items/'）；
this.bindAsArray（this.fb，'items'）；
},
render（）{
让集装箱式={
textAlign:'中心'，
paddingTop:'200px'
};
让标准动作=[
{文本：“好的”}
];
返回(
在我看来，你似乎是在MaterialUI案例中通过了
setState
之后才尝试登录，而在vanilla案例中则是之前。它们显然会做两件不同的事情。我在那里测试了其他东西。这些行被注释掉了。最终，我关心的是Firebase中更新了什么。vanilla更新了当前的值e、 Material提前一步更新了值。您能用当前问题生成JSFIDLE或jsbin吗？当然可以。请稍等。很抱歉，我无法将Material ui添加到jsbin或JSFIDLE。如果有帮助，请提交
  getInitialState: function() {
    return {text: ''};
  },
  handleChange: function(event) {
    //console.log(event.target.value)
    this.setState({text: event.target.value})
  },
  handleButtonClick: function() {
    //console.log(this.state.text)
    this.props.itemsStore.push({
      text: this.state.text,
      done: false
    });
    this.setState({text:''});
  },

  render: function(){
    return <div className="input-group">
      <input
        value = {this.state.text}
        onChange = {this.handleChange}
        type="text"
        className = "form-control"
        placeholder = "getting things done!"
      />
      <span className="input-group-btn">
        <button
          onClick={this.handleButtonClick}
          className="btn btn-default"
          type="button">
          Add
        </button>
      </span>
    </div>
  }