FormControlのReact-Bootstrap設定値選択

Question

フォームに使用しているSelectであるFormControlがあります。新しいリソースを追加するときはうまく動作しますが、既存のレコードを編集する場合は、コントロールの値を設定する必要があります。私は選択/コンボボックスの値を設定する良い方法は見ていない。これが私のJSXの外観です。

<FormGroup controlId="group"> 
    <ControlLabel>Group</ControlLabel> 
    <FormControl componentClass="select" placeholder="Group" 
       inputRef={ref => { this.groupSelect = ref; }} 
       onChange={this.groupSelect}> 
     <option></option> 
     { 
      this.state.groups.map(function (group) { 
       return <option key={group.id} value={group.id}>{group.name}</option> 
      }) 
     } 
    </FormControl> 
</FormGroup> 

このようにコンポーネントにアクセスしようとしましたが、未定義です。

console.debug(this.groupSelect); 
this.groupSelect.value(1); 

UPDATE：

私は次のことをしようとしているが、私は状態のアクセス権を持っていないので、これはバインドを呼び出すと、エラーが発生し、いずれかの作業をしていないと思われます。間違っている -

<FormGroup controlId="group"> 
           <ControlLabel>Group</ControlLabel> 
           <FormControl componentClass="select" placeholder="Group" 
              inputRef={(ref) => { this.state.groupSelect = ref }} 
              onChange={this.groupSelect}> 
            <option></option> 
            { 
             this.state.groups.map(function (group) { 
              return <option key={group.id} value={group.id} selected={this.state.selectedGroupId == group.id}>{group.name}</option> 
             }).bind(this) 
            } 
           </FormControl> 
          </FormGroup> 

Answer 1

選択した値がモデル（状態またはプロパティ）から来るべきでは、あなたが「jqueryの道」で必要なものを達成しようとしています。

Answer 2

重要な部分がありません。コンポーネントの値を設定する必要があります。追加：

groupSelectValueはあなたが編集しているレコードの値であり、 defaultValueはあなたが何のレコードまたはレコード内の値がない場合にデフォルトにしたいものです

value={this.state.groupSelectValue || defaultValue} 

。

その後、onChangeイベント機能（groupSelect(e)）で、あなたが行います。

this.setState({ 
groupSelectValue: e.target.value 
}); 

を状態を選択して更新されるように。