未定义不是_reactNavigation.StackNavigator附近的函数

Question

我想同时设置一个React Native和一个side menu的{​​{1}}应用。

我正在关注this教程。

My code。

我得到了错误：

  

未定义不是函数（'...（0，_reactNavigation.TabNavigator）...附近）

您可以在这里看到

某些文件的预览：

App.js

tab menu

navigators.js

import React from 'react';
import { Drawer } from './src/navigators';

export default class App extends React.Component {
  render() {
    return (
      <Drawer />
    );
  }
}

Answer 1

您从React Navigation导入的版本与您使用的版本（3.0.9）不正确。那些命名为export的文件在v1之后被重命名，这就是您正在使用的教程。

您正在导入：

import { DrawerNavigator, StackNavigator, TabNavigator } from 'react-navigation';

当您需要这样导入它们时：

import {
    createDrawerNavigator,
    createStackNavigator,
    createBottomTabNavigator,
    createAppContainer,
} from 'react-navigation';

您还需要在createAppContainer中包装根导航器（在本例中为Drawer导航器）。

像这样：

export const Drawer = createAppContainer(
  createDrawerNavigator({
    Stack: { screen: Stack },
    Tabs: { screen: Tabs },
    Plain: { screen: Plain },
  })
);

如果您想快速修复，只需进入package.json，然后将React Navigation的版本从 "react-navigation": "^3.0.9" 替换为 {{ 1}}，小吃将按预期运行https://snack.expo.io/@chris-bytelion/react-s

Answer 2

就我而言，解决方法是：

"react-navigation": "^1.5.2"

在package.json中。