• 本文
• リロード
• 差分
• バックアップ
• 名前変更
• リファラ
• 新規ページ
• 編集

React/コンポーネント

React/制御されたコンポーネント

Top / React / 制御されたコンポーネント

React によって値が制御される入力フォーム要素

https://ja.reactjs.org/docs/forms.html#controlled-components

自身で状態を保持

inputタグ

textareaタグ

• value

selectタグ

例

•   handleChange(event) {
      this.setState({value: event.target.value});
    }
  
   <input type="text" value={this.state.value} onChange={this.handleChange} />

• onChangeはキーストロークごとに実行されてReactのstateを更新

イベント

onChange(e)

• e.target.value
• 入力途中でも呼ばれる

onKeyPress?(e)

• e.key

メモ

• value
• defaultValue
• defaultChecked?

関連

• React/非制御コンポーネント
• React/state