datepicker上で反応クリックしてトグル値を変更したい

Question

私はFlight APIを開発しています。ユーザーが帰りの旅のフィールドをクリックすると、私はシングルトリップから往復へのボタンをトグルしたい（偽から真）。

<DatePicker 
    hintText="Return Date" 
    errorText={this.state.journeyDateErrorText} 
    onChange={(event, value) => {              
    this.setState({journeyDate: value}) 
    }} 
    minDate={new Date()}  
    onClick={this.enableReturnDate.bind(this)} 
    /> 

は、上記の私の日付ピッカーのフィールドであるとき、私は真（往復）に偽（片道）から私のトグルコンポーネントを切り替えたい、このフィールドにユーザーがクリック。

<Toggle 
thumbSwitchedStyle={{backgroundColor: 'grey'}} 
onToggle={this.handleonToggle.bind(this)} 
label={this.state.tripType} 
defaultToggled={false} 
/> 

私はonClickイベントを追加したことを望ん結果となどlable this.state.tripType示しているトグルの状態を変更取得します。

enableReturnDate(e){ 

    this.setState({ 
     tripType: 'Round Trip' 
    }) 
} 

後の状態トグルonClickイベントを追加this.state.tripTypeは、往復の単一旅行から変更されたが、私はfalseからtrueにすぎトグルボタンを変更したいです。

どうすればいいですか？あなたが状態を経て、トグル構成要素を制御する必要があります

Answer 1

、

<Toggle 
    thumbSwitchedStyle={{backgroundColor: 'grey'}} 
    onToggle={this.handleonToggle.bind(this)} 
    label={this.state.tripType} 
    defaultToggled={this.state.toggleState} // control toggle state by state 
    /> 

    // keep the toggle state as false initially, and change it to true when datePicker has been clicked or changed 

enableReturnDate(e){ 
     this.setState({ 
      tripType: 'Round Trip', 
      toggleState: true //dont forget the initialize the state as false in constructor 
     }) 
    }