React-Redux-Form - 日付ピッカーの統合

Question

私はreduxフォームを初めて使用しています。間違った用語を使用すると申し訳ありません。

私はreduxとバックエンド通信を処理するためにreact-redux-formを使用しています。 https://github.com/davidkpiano/react-redux-form

最近、私はdatepickerを実装するように求められました。私たちの初期の選択はAirbnb datepickerを使うことですが、キャプチャされた値をバックエンドに送ることはできません。 airbnbを持っていることで

<Form model="trip" onSubmit={(val) => this.handleSubmit(val)}> 
    <Control.select model=".city"> 
     {getCities} 
    </Control.select> 

    <Control 
     model=".travelDate" 
     component={SingleDatePicker} 
     mapProps={{ 
      onDateChange: props => props.onChange, 
      onFocusChange: props => props.onChange, 
      date: props => props.modelValue 
     }} 
    /> 
    <div> 
     <Button name="Lets Begin!" buttonType="primary" /> 
    </div> 
</Form> 

は、まあ、私は、検索のビットを行ってきた、そしてそれが反応し、日付ピッカー - ）（レンダリングの復帰に

：

は、多分それは私のコードを表示する方が簡単です反応還元型の問題のビット。もし誰かがより良いプラグインを使う価値があると知っていれば。あなたの助けのための

おかげで、

Answer 1

• が反応し、日時をhttps://github.com/YouCanBookMe/react-datetime implementaionは以下の通りである私に知らせてください： -

form.js

<div className="md-grid"><p className="md-cell--3 subheading">Valid until</p> 
 
     <div> 
 
      <Control 
 
       model='.valid_until' 
 
       component={DateField} 
 
       mapProps={{ 
 
        value: (props) =>{return props.viewValue} 
 
       }} 
 
       /> 
 
     </div> 
 
    </div>

Datefield.js

import React, {PureComponent, PropTypes} from "react"; 
 
import Datetime from 'react-datetime/DateTime'; 
 
require('react-datetime'); 
 

 

 
const DateComponent = (props)=> { 
 

 
    return (
 
     <Datetime defaultValue={new Date()} 
 
     value={props.value} 
 
     {...props} 
 
     style={{width:'150%'}}/> 
 
    ); 
 

 
}; 
 

 
export default DateComponent

• 第二に、あなたは私の命を救っ反応-MD日付ピッカー https://react-md.mlaursen.com/components/pickers/date