Ant Design 的 DatePicker 不能接收 string 值，使用 Form 的 initialValues 初始化时报错：date.clone is not a function

Ant Design 出于设计的考量，某一类型的控件只能接收某一类型的值。比如Input的value为string类型，InputNumber的value为number类型，同样的DatePicker的value则为moment类型。

这样的设计无可厚非，并且还考虑到了日期格式不一致的转换问题，甚至更换日期类库的问题。但实际使用中却存在一些不便利的情况，服务器返回的日期数据基本为字符串类型。官方给出的建议是先对服务器返回的日期数据进行处理，转换为moment类型。但这样无疑增加了代码量，造成使用不便利。

github中有issue讨论过这个问题：4.0.0 form组件使用initialValues 初始化数据，当包含“date”数据时，DatePicker组件报错“date.clone is not a function”

帖中的提问者最后通过自定义组件解决这个问题。这是个不错的思路，这里给出一个更完善的自定义组件代码。这要求服务器返回的日期数据必须是标准的格式，能够直接被moment处理。

import React, {FC} from 'react';
import {DatePicker} from 'antd';
import {DatePickerProps} from "antd/es/date-picker";
import moment from "moment";

const DatePicker2: FC<DatePickerProps> = props => {
  const {value, defaultValue, ...rest} = props;
  const dateValue = value && typeof value === 'string' ? moment(value) : value;
  const defaultDateValue = defaultValue && typeof defaultValue === 'string' ? moment(defaultValue) : defaultValue;
  return <DatePicker value={dateValue} defaultValue={defaultDateValue} {...rest}/>;
};
export default DatePicker2