createMaterialTopTabNavigator（）已移至“ react-navigation-tabs”错误react-native

Question

在我的一个旧项目中，我已从react-navigation 3升级到react-navigation 4，当我尝试运行时，我收到此“ createMaterialTopTabNavigator（）已移至'react-navigation-tabs'”错误。在我的其他项目中，代码工作正常。我什至删除了node_modules并重新安装了它，但仍然出现此错误。有人可以帮我穿这个鞋吗？

这是我的App.js

import {createAppContainer, createSwitchNavigator, NavigationActions} from 'react-navigation'
import { createStackNavigator } from 'react-navigation-stack';
import { createMaterialTopTabNavigator } from 'react-navigation-tabs';
import { createDrawerNavigator, DrawerNavigatorItems, DrawerActions } from 'react-navigation-drawer';

const TabNavigator = createMaterialTopTabNavigator(
{
  Upcoming: { screen: UpcomingScreen },
  Accepted: { screen: AcceptedScreen },
  Ongoing: { screen: OngoingScreen },
  Completed: { screen: CompletedScreen },
},
{
  tabBarOptions: {
      activeTintColor: '#000000',
      inactiveTintColor: '#000000',
      upperCaseLabel: false,
      style: {
        backgroundColor: '#ffffff',
        paddingTop: calcHeight(2)
      },
      labelStyle: {
        textAlign: 'center',
        fontSize: 12,
        fontFamily: Fonts.LatoRegular,
        fontWeight: 'normal'
      },
      indicatorStyle: {
        borderBottomColor: '#365888',
        borderBottomWidth: 2,
      },
  },
},
);

这是package.json

{
  "name": "rttDriver",
  "version": "0.0.1",
  "private": true,
  "rnpm": {
      "assets": [
      "./assets/fonts"
    ]
  },
  "scripts": {
      "start": "node node_modules/react-native/local-cli/cli.js start",
      "test": "jest"
  },
  "dependencies": {
  "@react-native-community/async-storage": "^1.6.1",
  "moment": "^2.24.0",
  "react": "16.8.3",
  "react-native": "0.59.9",
  "react-native-elements": "^1.1.0",
  "react-native-geolocation-service": "^3.0.0",
  "react-native-gesture-handler": "^1.4.1",
  "react-native-image-picker": "^0.28.0",
  "react-native-popup-dialog": "^0.18.3",
  "react-native-reanimated": "^1.3.0",
  "react-native-screens": "^1.0.0-alpha.23",
  "react-native-signature-capture": "^0.4.9",
  "react-native-svg": "^9.11.1",
  "react-native-svg-uri": "^1.2.3",
  "react-native-swiper": "^1.5.14",
  "react-native-vector-icons": "^6.6.0",
  "react-navigation": "^4.0.10",
  "react-navigation-drawer": "^1.4.0",
  "react-navigation-stack": "^1.9.4",
  "react-navigation-tabs": "^2.0.0-alpha.0"
  },
 "devDependencies": {
    "@babel/core": "7.5.5",
    "@babel/runtime": "7.5.5",
    "babel-jest": "24.9.0",
    "jest": "24.9.0",
    "jetifier": "^1.6.4",
    "metro-react-native-babel-preset": "0.56.0",
    "react-test-renderer": "16.8.3"
 },
 "jest": {
    "preset": "react-native"
  }
 }

我已附上以下图片

Answer 1

您似乎正在使用react navigatin v4.x.x，在此版本中，所有类型的导航都移到了单独的子库中，请从react-navigation-tabs中导入重要的顶部导航器

import createMaterialTopTabNavigator from 'react-navigation-tabs';

Answer 2

升级https://github.com/react-navigation/react-navigation/releases/tag/v4.0.0

时，请阅读发行说明。

Answer 3

只需输入

npm install @react-navigation/bottom-tabs

进入终端并重新启动