undefined nie jest obiektem (ocenianie „RNGuestureHandlerModule.state”)

Nowy w React-Native i kiedy próbuję dodać moduł nawigacyjny do mojej aplikacji, psuje się.

  import React from 'react';
  import { createStackNavigator, createAppContainer} from 'react- 
  navigation';
  import { StyleSheet, Platform, Image, Text, View, ScrollView, 
  TextInput, Button, FlatList } from 'react-native';

  import firebase from 'react-native-firebase';

  import Todo from './Todo';


class HomeScreen extends React.Component {

constructor() {
    super();
    this.ref = firebase.firestore().collection('todos');
    this.unsubscribe = null;
    this.state = {
        textInput: '',
        loading: true,
        todos: [],
    };

}
async componentDidMount() {
  // TODO: You: Do firebase things
  // const { user } = await firebase.auth().signInAnonymously();
  // console.warn('User -> ', user.toJSON());

  // await firebase.analytics().logEvent('foo', { bar: '123'});
}

componentDidMount() {
  this.unsubscribe = this.ref.onSnapshot(this.onCollectionUpdate)
}

componentWillUnmount() {
    this.unsubscribe();
}

updateTextInput(value) {
  this.setState({ textInput: value });
}

onCollectionUpdate = (querySnapshot) => {
  const todos = [];
  querySnapshot.forEach((doc) => {
    const { title, complete } = doc.data();
    todos.push({
      key: doc.id,
      doc, // DocumentSnapshot
      title,
      complete,
    });
  });
  this.setState({
    todos,
    loading: false,
  });
}

addTodo() {
  this.ref.add({
    title: this.state.textInput,
    complete: false,
  });
  this.setState({
    textInput: '',
  });
}




render() {
  if (this.state.loading) {
    return null; // or render a loading icon
  }
  return (
    <View style={{ flex: 1 }}>
        <Button
          title="Go to Jane's profile"
          onPress={() => navigate('Profile', {name: 'Jane'})}
        />
        <FlatList
          data={this.state.todos}
          renderItem={({ item }) => <Todo {...item} />}
        />
        <TextInput
            placeholder={'Add TODO'}
            value={this.state.textInput}
            onChangeText={(text) => this.updateTextInput(text)}
        />
        <Button
            title={'Add TODO'}
            disabled={!this.state.textInput.length}
            onPress={() => this.addTodo()}
        />
    </View>
  );
}

 }

 const AppNavigator = createStackNavigator({
   Home: {
    screen: HomeScreen
   }
 });

export default createAppContainer(AppNavigator);

Kiedy muszę uruchomić kod, pojawia się błąd

„undefined nie jest obiektem (ocenianie 'RNGuestureHandlerModule.state')”

Próbowałem uruchomić przykładowy kod nawigacji React i otrzymałem ten sam błąd.

Zastanawiasz się, czy to problem z moim plikiem index.js?

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);