// it has style inside index.scss ---> // Start SelectYear && end SelectYear import React, { useState, useRef } from "react"; import ScrollContainer from "react-indiana-drag-scroll"; import "./index.scss"; import arrowDown from "./arrow-down.svg"; import arrowUp from "./arrow-up.svg"; import Month from "./Month.js"; const SelectYear = ({ items }) => { const [selectedYear, setSelectedYear] = useState(null); const yearEl = useRef(null); const h = 40; const up = () => { if (yearEl.current) yearEl.current.scrollTop -= h; }; const down = () => { if (yearEl.current) yearEl.current.scrollTop += h; }; const scrollTo = (index) => { yearEl.current.scrollTop = (index - 1) * h; }; return (
{/*
*/}
{items.map((item, index) => (

{ scrollTo(index); setSelectedYear(item); // if(index {item.year}

))}
); }; export default SelectYear; SelectYear.defaultProps = { items: [ { id: 1, year: "1400", }, { id: 2, year: "1399", }, { id: 3, year: "1398", }, { id: 4, year: "1397", }, { id: 5, year: "1396", }, { id: 6, year: "1400", }, { id: 7, year: "1399", }, { id: 8, year: "1398", }, { id: 9, year: "1397", }, { id: 10, year: "1396", }, ], };