Ant Design DatePicker 报错 'moment is not defined' 或 'DatePickerProps is not defined' 的解决方法

以下代码可能出现 'moment is not defined' 或者 'DatePickerProps is not defined' 的报错，可以参考以下解决方案进行修改：

import {DatePickerProps} from 'antd/es/date-picker';
interface QDatePickerProps extends DatePickerProps {
    value?: string | moment.Moment;
}

1. 'moment is not defined' 错误

该错误是因为代码中使用了 moment，但没有正确引入。可以将代码修改为：

import {DatePickerProps} from 'antd/es/date-picker';
import moment from 'moment';
interface QDatePickerProps extends DatePickerProps {
    value?: string | moment.Moment;
}

2. 'DatePickerProps is not defined' 错误

该错误是因为代码中使用了 DatePickerProps，但没有正确引入。可以将代码修改为：

import {DatePicker} from 'antd';
import {DatePickerProps} from 'antd/lib/date-picker/interface';
import moment from 'moment';
interface QDatePickerProps extends DatePickerProps {
    value?: string | moment.Moment;
}
const QDatePicker: React.FC<QDatePickerProps> = ({value, onChange, ...restProps}) => {
    const handleChange = (value: moment.Moment | null, dateString: string) => {
        onChange && onChange(dateString, value);
    };
    return (
        <DatePicker value={value ? moment(value) : undefined} onChange={handleChange} {...restProps}/>
    );
};
export default QDatePicker;

这里除了引入 DatePickerProps，还将 import {DatePicker} from 'antd' 修改为了 import {DatePicker} from 'antd/es/date-picker'，这是因为 antd 的模块化引入方式有所改变，具体可以参考官方文档。