React Native PageView的onPageScroll在iPhone 12+上给出了错误的位置

cbwuti44  于 2023-01-21  发布在  React
关注(0)|答案(1)|浏览(141)

在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和更新的设备上。

vqlkdk9b

vqlkdk9b1#

我没有使用'react-native-modal',我使用了全屏模式。screenOptions={{ presentation: 'modal' }}

相关问题