时间戳

首页 > 解决方案 > 蚂蚁设计 4 到期日不应小于发行日

antd - 蚂蚁设计 4 到期日不应小于发行日

问题描述

我是蚂蚁设计的新手。我有一个带有两个日期选择器的表格。发行日期和到期日。我希望能够将到期日期的日期选择器限制为不早于发行日期。到目前为止，这是我的方法。

 <Form.Item
                      label="Issue Date"
                      name={["userIdentification", "identification_issue_date"]}
                      rules={[
                        {
                          required: true,
                          message: REQUIRED_ERROR_MESSAGE,
                        },
                      ]}
                    >
                      <DatePicker
                        disabledDate={(current) =>
                          current && current > moment()
                        }
                      />
                    </Form.Item>

                    <Form.Item
                      label="Expiry Date"
                      name={[
                        "userIdentification",
                        "identification_expiry_date",
                      ]}
                      dependencies={[
                        "userIdentification",
                        "identification_issue_date",
                      ]}
                      rules={[
                        {
                          required: true,
                          message: REQUIRED_ERROR_MESSAGE,
                        },
                        ({ getFieldValue }) => ({
                          validator(_, value) {
                            console.log(
                              "fields value from issue_date",
                              getFieldValue([
                                "userIdentification",
                                "identification_issue_date",
                              ])
                            );
                            if (!value && getFieldValue("allocation") === "") {
                              return Promise.reject(REQUIRED_ERROR_MESSAGE);
                            }
                            return Promise.resolve();
                          },
                        }),
                      ]}
                    >
                      <DatePicker
                        disabledDate={(current) =>
                          current && current > moment()
                        }
                      />
                    </Form.Item>

任何帮助将不胜感激

标签： antd

解决方案

正如您在此论坛上看到的，找到的最佳解决方案是使用 disableDate 并添加此代码

<DatePicker value={value} onChange={this.onDatePickerChange} disabledDate={d => !d || d.isBefore(minimum)} />

另一种方法是添加类似 minDate 的东西，其过程与上述类似。你可以在这里阅读更多

推荐阅读