undefined不是对象(评估'RNGestureHandlerModule.State'

Question

我在我的React Native项目中安装了react-navigation.它的启动项目没有任何代码.但是在运行项目时我遇到了这样的错误.

这是我的导航代码

import { createStackNavigator } from 'react-navigation';

import Home from './screens/Home';
import WeatherDetail from './screens/WeatherDetail';


const Navigation = createStackNavigator({
  Home: { screen: Home },
  WeatherDetail: {
  screen: WeatherDetail
 } 
});

export default Navigation;

这是App.js代码

 import Navigator from './Router';


 export default class App extends Component {
   render() {
     return (
       <View style={styles.container}>
         <Navigator />
       </View>
     );
    }
  }

如果我从App.js中删除导航器组件并将其替换为Text,则应用程序运行时不会出现任何错误.

Answer 1

1. 删除node_modules和package-lock.json
2. npm install
3. npm install --save react-navigation
4. npm install --save react-native-gesture-handler
5. react-native link

Answer 2

如果您使用react-link链接您的依赖项：

1. 0pen您的ios Podfile并删除所有您链接的依赖项：pod'xxxxxxx'，：path =>'../node_modules/xxxxx
2. 关闭Xcode
3. 在您的/ ios文件夹中运行“ pod update”
4. 在您的项目源中运行“ react-native链接”
5. 从Xcode菜单->产品中打开Xcode并清理构建文件夹
6. 从Xcode运行您的应用程序
7. 按照文档中的步骤，将依赖项“ react-native-gesture-handler”手动链接到您的Xcode项目中：https : //facebook.github.io/react-native/docs/linking-libraries-ios
8. 现在从Xcode运行您的应用程序，应该没问题。

Answer 3

来自官方文档：

如果您使用的是 React Native >= 0.60，则需要先禁用 react-native-gesture-handler 的自动链接。要禁用它的自动链接，请在项目的根目录中创建一个 react-native.config.js 文件，内容如下：

module.exports = {
  dependencies: {
    'react-native-gesture-handler': {
      platforms: {
        android: null,
        ios: null,
      },
    },
  },
};

如果您使用的是 React 0.60，请忽略此官方文档。请按照以下步骤操作：

1. rm react-native.config.js 如果存在
2. react-native link react-native-gesture-handler
3. cd ios && pod install && cd ..
4. react-native run-ios