React-datepicker Years Range

I am using the react-datepicker package.https://reactdatepicker.com/ I am trying to create a custom date picker with a years range, following their example but I can not make the r

Solution 1:

Use below imports and all the code in documentation will work fine!

import { getMonth, getYear } from'date-fns';
importrangefrom"lodash/range";

Solution 2:

Functions getYear and getMonth are imported from date-fns library into react-datepicker/src/date_utils.js

I don't know about range function. I see it's being used in one example at their site (just a bunch of examples, no documentation) but there's nothing else.

You can simply import from date-fns (being a dependency of DataPicker) and create a range function.

importReact, { useState } from"react";
importDatePickerfrom"react-datepicker";
import getYear from"date-fns/getYear";
import getMonth from"date-fns/getYear";
import"react-datepicker/dist/react-datepicker.css";

constFoo = () => {
  const [startDate, setStartDate] = useState(newDate());

  constrange = (start, end) => {
    returnnewArray(end - start).fill().map((d, i) => i + start);
  };
  const years = range(1990, getYear(newDate()));
(...)

You can check a working demo here.