SetStateが反応コンポーネントで起動しない

Question

私はreact、redux、およびes2015を使用してtodoアプリケーションを開発中です。私はちょうど反応ブートストラップを導入しました。私の単純な入力制御が期待どおりに機能していません。上記のコメントで述べたよう

import React from 'react' 
import { connect } from 'react-redux' 
import { addTodo } from '../actions' 
import { FormGroup, ControlLabel, Input, FormControl } from 'react-bootstrap' 

class AddTodo extends React.Component { 
    constructor(props) { 
     super(props); 

     this.handleChange = this.handleChange.bind(this); 
     this.submit = this.submit.bind(this); 

     this.state = { 
      value: '' 
     } 
    } 

    handleChange(e) { 
     this.setState({ value: e.target.value }); // WORKS 
    } 

    submit() {   
     this.props.dispatch(addTodo(this.state.value)); // WORKS 
     this.setState({ value: '' }); // FAILS 
    } 

    render() {  
     return (
      <FormGroup> 
       <ControlLabel>Add Todo</ControlLabel> 
       <FormControl 
        type='text' 
        onChange={this.handleChange} 
        onBlur={this.submit}/>   
      </FormGroup> 
     ); 
    } 
} 

AddTodo = connect()(AddTodo); 

export default AddTodo; 

、動作していない空の値にリセット入力べき送信方法でSETSTATE（）呼び出し、入力したばかりであったものは何でも保持：次のように コードであります最後に入力します。 コンソールにもエラーも警告もありません。

私は明らかに何かが不足していますが、何が分かりませんか？

おかげ

Answer 1

が見えます状態を追跡する。そのようなあなたの<FormControl />

にvalue属性を追加します。

<FormControl 
    type='text' 
    value={this.state.value} <-- Yay value updates! 
    onChange={this.handleChange} 
    onBlur={this.submit}/> 

**また、onBlurイベントは、あなたの部分の意図的な行動であると仮定しよう。

Answer 2

グラブ最初の別の変数の値が、その後、「」に状態を設定し、ディスパッチ：フォームコントロールが値あなたに接続されていないよう

submit() {   
    let val = this.state.value; 
    this.setState({ value: '' }); 
    this.props.dispatch(addTodo(val)); 
}