React material-ui date-pickerで日付を書式設定するにはどうすればよいですか？

Question

私はmaterial-ui date-pickerフィールドを使ってredux-formを実装しています。日付は完全にフィールドに設定されますが、私は、日付のバックエンドAPI形式にそれを送信しようとするとされている。

BeginDate_1: Tue Nov 14 2017 15:03:43 GMT+0530 (IST)

私は「YYYY-MM-DD」にこの形式を変更しようとしていますバックエンドAPIに送信する前にフォーマットしてください。

フォーマットにはmomentjsを試しましたが、私が望む結果が得られませんでした。ここで

は、私が試したものです：

Home.js

import React, {Component} from 'react'; 
import {Field, reduxForm} from 'redux-form'; 
import DatePicker from 'material-ui/DatePicker'; 
import {connect} from 'react-redux'; 
import * as moment from 'moment'; 

class Home extends Component { 

renderCalendarField= ({ 
          input, 
          label, 
          meta: {touched, error}, 
          children, 
          ...custom 
         }) => (
    <DatePicker 
     floatingLabelText={label} 
     errorText={touched && error} 
     {...input} 
     value = {input.value !== ''? new Date(input.value) : null} 
     onChange={(event, value) => input.onChange(value)} 
     children={children} 
     {...custom} 
     formatDate={(date) => moment(date).format('YYYY-MM-DD')} 

    /> 

) 

render() { 

    const startDate = new Date(); 

    const {handleSubmit} = this.props; 

    return (

     <form onSubmit={handleSubmit(this.onSubmit.bind(this))}> 


      <div> 
       <Field name="BeginDate_1" component={this.renderCalendarField} label="DEPARTURE" minDate={startDate} /> 
      </div> 


      <div> 
       <button type="submit"> 
        Submit 
       </button> 
      </div> 

     </form> 

    ); 

} 

} 

const LogInForm = reduxForm({ 
form: 'MaterialUiForm', // a unique identifier for this form 
validate 
})(Home); 

export default connect(mapStateTOProps, {getCity})(LogInForm); 

は、コンソール出力がまだある：私はYYYY-mm-ddでこの日付の書式を設定するにはどうすればよい

BeginDate_1:Tue Nov 14 2017 15:03:43 GMT+0530 (IST)

フォーマット？

Answer 1

formatDateDatePickerの小道具は、 Display Dateに使用されており、実際の値ではありません。である何をする必要がある、material-ui/DatePicker docsによるとmoment

onSubmit (values) { 

    const beginDate = moment(values.BeginDate_1).format('YYYY-MM-DD') 
    console.log(beginDate); 
    //other things 
} 

使用onSubmit機能の値をフォーマットする：TypeError例外：：__WEBPACK_IMPORTED_MODULE_12_moment __（...）

formatDate: function

This function is called to format the date displayed in the input field, and should return a string. By default if no locale and DateTimeFormat is provided date objects are formatted to ISO 8601 YYYY-MM-DD.

Signature:

function(date: object) => any 
date: Date object to be formatted. 
returns (any): The formatted date.