ReactJSコンポーネントセットの状態は何もしていませんか？

Question

私はReactJSの初心者です。それは作品

class SearchBar extends Component { 
    constructor(props) { 
    super(props); 

    this.state = {term: ''}; 
    } 

    render() { 
    return (
     <div> 
     <input onChange={ event => this.setState({ term: event.target.value })} /> 
     </div> 
    ); 
    } 
} 

が、問題は、私は、入力の変更された値を得ることができなかったです。私は、次のよう検索バーをやろうとしています。どうしたの？私は解決策を見つけることができませんでした。ご協力いただきありがとうございます。

Answer 1

入力の値を設定していません。入力を、制御されたコンポーネントに変更する必要があります。制御されたコンポーネントは、状態によって値が設定されるため、値が変更されたときにのみ変更されます。

<input 
     value = { this.state.term } 
     onChange= { (event) => this.setState({ term: event.target.value }) } /> 

したがって、this.stateをレンダリングするコンポーネントを引き起こし、それは場合this.state.termの新しい値に設定されている要素（例えば入力IN）の値を再描画します。

Answer 2

入力に値を割り当てていません。

<input value={this.state.term} onChange={ event => this.setState({ term: event.target.value })} />