Next month button doesn't work.

[longman0512]

No description provided.

[johnny-minty]

@longman0512 You need to ensure you handle the onChange event properly and set/update the 'displayedDate' prop correctly

[aldiinugroho]

maybe dates.displayedDate will be undefined, therefore we need to give certain conditions.

try this maybe it help:

const setDates = (dates) => {
        if (dates.startDate != undefined) {
            setStartDate(dates.startDate)
        }

        if (dates.displayedDate != undefined) {
            setDisplayedDate(dates.displayedDate)
        }

        if (dates.endDate != undefined) {
            setEndDate(dates.endDate)
        }
    };

[fcamargo10]

maybe dates.displayedDate will be undefined, therefore we need to give certain conditions.

try this maybe it help:

const setDates = (dates) => {
        if (dates.startDate != undefined) {
            setStartDate(dates.startDate)
        }

        if (dates.displayedDate != undefined) {
            setDisplayedDate(dates.displayedDate)
        }

        if (dates.endDate != undefined) {
            setEndDate(dates.endDate)
        }
    };

Work's fine.

[shoaibshebi]

Set Like that

👇👇😊

const [dateObj, setDateObj] = useState({
    startDate: null,
    endDate: null,
    displayedDate: moment(),
  });
  
  
<DateRangePicker
            onChange={dates => {
              console.log('dates ------------------', dates);
              setDateObj({
                startDate:
                  'startDate' in dates
                    ? moment(dates.startDate)
                    : dateObj?.startDate,
                endDate:
                  'endDate' in dates ? moment(dates.endDate) : dateObj?.endDate,
                displayedDate:
                  'displayedDate' in dates
                    ? moment(dates.displayedDate)
                    : dateObj?.displayedDate,
              });
            }}
            endDate={dateObj?.endDate}
            startDate={dateObj?.startDate}
            displayedDate={dateObj?.displayedDate}
            range={true}
>