@react-datepicker/ui
  • 👋Welcome
  • Getting Started
    • Quickstart
  • Documentation
    • 🔨Building your calendar
    • ⏭️Adding months navigation
    • Arrange to weeks
    • 🎨Design & Customizations
    • 📆Range Picker
    • Calendar options
    • 🌍Localization
    • 🗓️Events scheduling
  • UI Components
    • Calendar
    • Datepicker
    • DateRangePicker
  • Group 1
    • Page 1
Powered by GitBook
On this page
  1. Documentation

Range Picker

useCalendar supports a date range mode, all you need to do is to call the hook with the isRangePicker option set to true , mind that in date range mode, the range value is stored in a different variable - rangeValue

const { rangeValue } = useCalendar({
  isRangePicker: true,
});

console.log(JSON.strigify(rangeValue));
// {"startDate":"2024-12-09T22:00:00.000Z","endDate":"2024-12-17T22:00:00.000Z"}

PreviousDesign & CustomizationsNextCalendar options

Last updated 6 months ago

📆