在ReactNative中使用"react-native-pager-view": "^6.1.2"
包。
我有和这里一样的虫子。
https://github.com/callstack/react-native-pager-view/issues/503
我尝试使用下面粘贴的代码浏览PagerView,但是当我滑动页面时,e.nativeEvent.position与实际的页面索引不同。
import PagerView, { PagerViewOnPageScrollEvent, PagerViewOnPageSelectedEvent } from 'react-native-pager-view';
import Modal from 'react-native-modal';
const onPageScroll = useCallback((e: PagerViewOnPageScrollEvent) => onPageScrollPagerView(e, setCurrentTabIndex), []);
const onPageScrollPagerView = (
e: PagerViewOnPageScrollEvent,
setCurrentTabIndex: React.Dispatch<React.SetStateAction<number>>,
) => {
console.log(`onPageScroll position = ${e.nativeEvent.position}`);
setCurrentTabIndex(e.nativeEvent.position);
};
return (
<Modal isVisible={isVisible}>
<SafeAreaView>
<View>
<PagerView ref={viewPager} initialPage={0} onPageScroll={onPageScroll} onPageSelected={onPageSelected}>
{list.map((item) => (
<View key={item.id}>
{item.content}
</View>
))}
</PagerView>
</View>
</SafeAreaView>
</Modal>
);
这是滚动到第一页时获得的结果。onPageScroll被调用了两次,由于某种原因,第二次返回了错误的位置。
并且将0设置为setCurrentTabIndex。
onPageScroll position = 1
onPageScroll position = 0
有什么办法可以解决这个问题吗?
可能和你在'react-native-modal'
的<Modal></Modal>
里写的东西有关。
同样如本文所述,此问题不会发生在iPhone11上,而是发生在iPhone12和更新的设备上。
1条答案
按热度按时间vqlkdk9b1#
我没有使用
'react-native-modal'
,我使用了全屏模式。screenOptions={{ presentation: 'modal' }}