Question

当我在带有getFieldDecorator的表单中的react.js中使用DatePicker时，一旦选择了日期，它将出现一个错误，提示“ datepicker值不是字符串”。

我尝试了不带表单的getFieldDecorator的datepicker，该表单不会显示错误。但是我需要将DatePicker与getFieldDecorator一起使用。

<FormItem
                {...formItemLayout}
                label="Start Date"
            >
                {getFieldDecorator('startValue', {
                    rules: [{
                        message: 'The input is not a valid Start Date!'
                    }, {
                        required: true, message: 'Please input your Starting Date for the assigned task',
                    }],
                })(
                    <DatePicker
                        disabledDate={this.disabledStartDate}
                        showTime
                        format="YYYY-MM-DD HH:mm:ss"
                        placeholder="Start"
                        onChange={this.onStartChange}
                        onOpenChange={this.handleStartOpenChange}
                    />
                )}
</FormItem>

上面是datepicker代码的一部分。在那里，我总是收到一条错误消息，提示输入的有效日期无效！（在控制台中，它说的不是字符串。）那么如何解决此错误？

Answer 1

您需要从验证规则中删除此部分：

3;

您可以检查validation rules of ant-design。我创建了一个working demo。

Answer 2

        <FormItem {...formItemLayoutWithOutLabel}>
          {getFieldDecorator("startValue", {
            rules: [
              {
                required: true,
                message: "Please input your Starting Date for the assigned task"
              }
            ]
          })(
            <DatePicker
              disabledDate={this.disabledStartDate}
              showTime
              format="YYYY-MM-DD HH:mm:ss"
              placeholder="Start"
              onChange={this.onStartChange}
              onOpenChange={this.handleStartOpenChange}
            />
          )}
        </FormItem>

与getFieldDecorator一起使用时，ant设计中日期选择器的类型不是字符串

2 个答案: