Search code examples
reactjsdatepickermomentjsantd

Ant design DatePicker in form

I'm using DatePicker component from antd inside a form and want to change the default onChange and value of props in DatePicker but it is not working.

<Form.Item
  label='Test Label'
  name='startDate'
  getValueFromEvent={(onChange) => moment(onChange).format('YYYY-MM-DD')}
  getValueProps={(i) => moment(i)}
>
  <DatePicker format='YYYY-MM-DD' style={{ width: '100%' }} />
</Form.Item>

When I use DatePicker outside of the form it works:

<DatePicker value={moment()} style={{ width: '100%' }} />

Is this a problem with getValueProps prop?

Solution

  • I fixed it!

    In case that anyone has same issue:

    you have to change getValueProps to something like this:

    getValueProps={(i) => ({value: moment(i)})}