React Js Year Picker | Year list in dropdown

      // Add the import statement for useState hook

      const { useState } = React;

​

      // Define the App component

      const App = () => {

        const [selectedYear, setSelectedYear] = useState("");

​

        const handleYearChange = (event) => {

          setSelectedYear(event.target.value);

        };

​

        const years = Array.from(

          { length: 50 },

          (_, index) => new Date().getFullYear() - index

        );

​

        return (

          <div className="year-picker">

            <h3>React Js Year Picker</h3>

            <select value={selectedYear} onChange={handleYearChange}>

              <option value="">Select a year</option>

              {years.map((year) => (

                <option key={year} value={year}>

                  {year}

                </option>

              ))}

            </select>

            {selectedYear && <p>You selected: {selectedYear}</p>}

          </div>

        );

      };

​

      ReactDOM.render(<App />, document.getElementById("app"));

    </script>