导入React Navigation的Material Top Tabs报RNCViewPager错误，如何禁用其viewpager？

禁用原生ViewPager方案 #

直接替换导航器的pager实现为纯JS版本，无需依赖原生RNCViewPager，修改配置即可：

import { createMaterialTopTabNavigator, PagerScrollView } from '@react-navigation/material-top-tabs';

const Tab = createMaterialTopTabNavigator();

function TopTabs() {
  return (
    <Tab.Navigator
      pager={PagerScrollView}
      // 无需滑动切换时可追加以下配置
      // swipeEnabled={false}
      // animationEnabled={false}
    >
      <Tab.Screen name="TabA" component={TabA} />
      <Tab.Screen name="TabB" component={TabB} />
    </Tab.Navigator>
  );
}

保留原生ViewPager修复方案 #

之前安装@react-native-community/viewpager失效是因为该包已停止维护，官方已迁移到新包，按以下步骤操作：

• 卸载废弃依赖：npm uninstall @react-native-community/viewpager
• 安装官方新版依赖：npm install react-native-pager-view
• iOS端进入ios目录执行pod install后重启项目
• Android端重新编译运行项目即可完成自动链接
• React Native 0.60以下版本需手动执行npx react-native link react-native-pager-view完成原生链接

内容的提问来源于stack exchange，提问作者Nathan McKenzie