reactjs - 如何根据使用 antd 的选择禁用两个日期之间的一个日历中的日期？

Question

我在一个日历中有一个日期，例如我不应该选择 1975 年之前或 2012 年之后的日期，只允许 1975 年到 2012 年之间的日期。

如何将日历限制在日期范围内？

我的示例日期选择器：

import { AntDatePicker } from "./shared/CreateAntFields";

class DatePickerComponent extends React.Component {

    state = { 
        visible: false,  
    }

    disabledDate(current) {
        const startDate = '1992-05-12';
        console.log("StartDate",startDate)
        const endDate = new Date()
        console.log("EndDate",endDate)
        return startDate && endDate < moment().endOf('year');
    }

    render() {
        const { values, handleSubmit, setFieldValue } = this.props
        return (
            <div align="center">

                <Form onSubmit={handleSubmit}>

                    <Field
                        name="dateOfBirth"
                        label="Date Of Birth"
                        placeholder="Date Of Birth"
                        component={AntDatePicker}
                        value={values.dateOfBirth}
                        disabledDate={this.disabledDate}


                    />

                    <Button type="primary" htmlType="submit">Submit</Button>

                </Form>
            </div>
        )
    }

}

const DatePickerRange = (withFormik)({
    handleSubmit(values, { resetForm }) {
        resetForm();
        console.log(values)
    }

})(DatePickerComponent)

标签： reactjsgatsbyantdformik

Answer 1

你几乎明白了，

let startDate = moment('2/2/1975') //anydate in 1975 works
let endDate = moment('2/2/2012') //anydate in 2012 works

return current < startDate.startOf('year') || current > endDate.endOf('year');