我目前有一个 map 和一个旋转木马(类似于FlatList
),我希望能够使用FlatList
的scrollToIndex
方法捕捉到阵列中的某个项目。问题是我何时采用了 react-native-snap-carousel库,它基于 ScrollView
,我失去了使用 scrollToIndex
方法的能力。滚动到某个索引的功能在 FlatList
中运行得非常好。
我正在使用功能组件,所以我正在使用 useRef
Hook :
const flatListRef = useRef()
const handleMarker = index => {
flatListRef.current.scrollToIndex({ index, animated: true })
}
我正在为我的 map 使用 react-native-maps
并且上面的 handleMarker
是这样的,当用户点击 map 上的标记时,Carousel 会捕捉相关项目:
<Marker
key={marker.id}
coordinate={{ latitude: marker.latitude, longitude: marker.longitude }}
onPress={() => handleMarker(index)}
ref={markerRef[index]}
>
</Marker>
以下是替换 FlatList
的 Carousel:
<Carousel
data={items}
renderItem={({ item }) => <Item item={item}/>}
horizontal={true}
ref={flatListRef}
sliderWidth={width}
sliderHeight={100}
itemWidth={140}
itemHeight={100}
/>
如果没有 scrollToIndex
,我如何实现这一点?
最佳答案
尝试使用提供的方法来代替
const handleMarker = index => {
flatListRef.current.snapToItem(index);
}
关于javascript - scrollToIndex() 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59462489/