حالت تکی
برای تنظیم تعداد ماههایی که می خواهید در تقویم نمایش داده شود ، از پراپرتی numberOfMonths استفاده کنید.
این ویژگی رو میشه برای Datapiker یا تقویم در همه حالت های منفرد ، چندگانه و دامنه اعمال کرد.
استفاده از disableMonthPicker و disableYearPicker اختیاری است .
import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
<Calendar
numberOfMonths={2}
disableMonthPicker
disableYearPicker
calendar={persian}
locale={fa}
/>
انتخابگر چندتایی
import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
const [dates, setDates] = useState([
new DateObject({ calendar: persian }).setDay(5),
new DateObject({ calendar: persian }).setDay(12),
new DateObject({ calendar: persian }).setDay(14).add(1, "month"),
new DateObject({ calendar: persian }).setDay(23).add(1, "month"),
])
.
.
.
<DatePicker
value={dates}
onChange={setDates}
multiple
numberOfMonths={2}
calendar={persian}
locale={persian_fa}
calendarPosition="bottom-right"
/>
انتخابگر دامنه ای از زمان
import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
const [values, setValues] = useState([
new DateObject({ calendar: persian }).setDay(4).subtract(1, "month"),
new DateObject({ calendar: persian }).setDay(4).add(1, "month")
])
.
.
.
<Calendar
value={values}
onChange={setValues}
range
numberOfMonths={3}
showOtherDays
calendar={persian}
locale={fa}
/>