我使用的是Form+DatePicker，当我给DatePicker的FormItem的getFieldDecorator的initialValue设置初始值为空字符串时，当我打开新增或者编辑页面就报了以下错误： Invalid prop value of type string supplied to Calendar, expected object
我们通过报❌，很明显的能知道是我们传给组件的初始值类型错了 查看了下官网，我们发现DatePicker组件的defaultValue只支持moment日期对象 因此，我尝试将代码改成：initialValue: moment()，然后再次查看，发现没有再次报错了✅ 然而，写成initialValue: moment()只是方便测试，我们应该写成这样子：
const date = type == 'edit' ? moment(time, 'YYYY/MM/DD HH:mm') : null // 注意 这里不能返回moment() 否则默认值是当前日期，更不能写{}，他不是个日期格式的数据，虽然要求是object类型，但是数值无法被组件成功解析————————————————
当然，前提是<DatePicker showTime={{ format: ‘HH:mm’ }} format='YYYY-MM-DD HH:mm' placeholder=‘请输入发布时间’ /> format必须设置
import React, { Component } from 'react' import { Modal, Form, DatePicker, Input } from 'antd' import moment from 'moment'; const FormItem = Form.Item const { TextArea } = Input class TipsModal extends Component { componentDidMount() { this.props.getTipsModalForm(this.props.form) } render() { const { getFieldDecorator } = this.props.form const { visible, onCancel, onOk, record, type } = this.props const FormItemLayout = { labelCol: { span: 5 }, wrapperCol: { span: 19 } } const title = type == 'edit' ? '编辑投标战况' : '新增投标战况' const time = moment(record.releaseTime).utc(480).format() const date = type == 'edit' ? moment(time, 'YYYY/MM/DD HH:mm') : null // 注意 这里不能返回moment() 否则默认值是当前日期，更不能写{}，他不是个日期格式的数据，虽然要求是object类型，但是数值无法被组件成功解析 const des = type == 'edit' ? record.tip : '' return ( <Modal title={title} visible={visible} onOk={onOk} onCancel={onCancel} > <Form> <FormItem {...FormItemLayout} label='产品名称'> {getFieldDecorator('prdName', { initialValue: '', })( <h3>{record.projName}</h3> )} </FormItem> <FormItem {...FormItemLayout} label='发布时间'> {getFieldDecorator('releaseTime', { // initialValue: ’‘, initialValue: date, rules: [{ required: true, message: "请输入发布时间" }], })( <DatePicker showTime={{ format: 'HH:mm' }} format='YYYY-MM-DD HH:mm' placeholder='请输入发布时间' /> )} </FormItem> <FormItem {...FormItemLayout} label='投标战况'> {getFieldDecorator('tip', { initialValue: des, rules: [{ required: true, message: "请输入投标战况" }], })( <TextArea placeholder='请输入投标战况' autosize={{ minRows: 3, maxRows: 6 }} /> )} </FormItem> </Form> </Modal> ) } } export default Form.create()(TipsModal)