diff --git a/menu.js b/menu.js index 35460e5..1392e8c 100644 --- a/menu.js +++ b/menu.js @@ -103,40 +103,40 @@ export default function Menu({ getCurrentTrain, scrollRef }) { const [nearPositionStation, setNearPositionStation] = useState(undefined); //第三要素 const carouselRef = useRef(); - const [selectedCurrentStation, setSelectedCurrentStation] = useState(0); + const [listIndex, setListIndex] = useState(0); - const [allStationData, setAllStationData] = useState([]); + const [listUpStation, setListUpStation] = useState([]); useEffect(() => { if (stationListMode == "position") { console.log(nearPositionStation); - setAllStationData([nearPositionStation].filter((d) => d != undefined)); + setListUpStation([nearPositionStation].filter((d) => d != undefined)); } else { - setAllStationData(favoriteStation.filter((d) => d != undefined)); + setListUpStation(favoriteStation.filter((d) => d != undefined)); } }, [nearPositionStation, favoriteStation, stationListMode]); useEffect(() => { - if (allStationData.length == 0) { - setSelectedCurrentStation(0); + if (listUpStation.length == 0) { + setListIndex(0); return; } - if (allStationData[selectedCurrentStation] == undefined) { - const count = selectedCurrentStation - 1; - setSelectedCurrentStation(count); + if (listUpStation[listIndex] == undefined) { + const count = listIndex - 1; + setListIndex(count); } - }, [selectedCurrentStation, nearPositionStation, allStationData]); + }, [listIndex, nearPositionStation, listUpStation]); useEffect(() => { if (!carouselRef.current) return; carouselRef?.current.scrollTo({ - count: selectedCurrentStation - carouselRef.current.getCurrentIndex(), + count: listIndex - carouselRef.current.getCurrentIndex(), animated: true, }); - }, [selectedCurrentStation]); + }, [listIndex]); useEffect(() => { if (originalStationList == undefined) return; - if (allStationData.length == 0) return; - if (allStationData[selectedCurrentStation] == undefined) return; - const { lat, lng } = allStationData[selectedCurrentStation][0]; + if (listUpStation.length == 0) return; + if (listUpStation[listIndex] == undefined) return; + const { lat, lng } = listUpStation[listIndex][0]; const mapRegion = { latitude: lat, longitude: lng, @@ -144,7 +144,7 @@ export default function Menu({ getCurrentTrain, scrollRef }) { longitudeDelta: 0.05, }; mapsRef.current.animateToRegion(mapRegion, 1000); - }, [selectedCurrentStation, nearPositionStation, allStationData, mapsRef]); + }, [listIndex, nearPositionStation, listUpStation, mapsRef]); return ( - {allStationData.length != 0 && originalStationList.length != 0 && ( + {listUpStation.length != 0 && originalStationList.length != 0 && ( <> - {allStationData[selectedCurrentStation] && ( + {listUpStation[listIndex] && ( {}}