Date Ranges

The DatePicker provides options for displaying date ranges.

You can control the range of dates by setting the min and max properties.

The following example demonstrates how to limit the value of the DatePicker to a certain date range.

class App extends React.Component {
    min = new Date(2000, 2, 10);
    max = new Date(2002, 2, 10);
    defaultValue = new Date(2001, 2, 10);

    render() {
        return (
            <div>
                <div className="example-config">
                    <p>Select a date:</p>
                    <DatePicker
                        min={this.min}
                        max={this.max}
                        defaultValue={this.defaultValue}
                    ></DatePicker>
                </div>
            </div>
        )
    }
}
ReactDOM.render(
    <App />,
    document.querySelector('my-app')
);

In this article

 /