React Native Navigation v1 вылетает в statTabBasedApp

Question

Когда я перемещаю свое приложение в startTabBasedApp (Мои 3 вкладки), 1-й экран Render - это EventMap.js, где происходит сбой моего приложения.Я просто не знаю, почему это происходит сбой, я пытался поставить console.log во всех частях моих кодов, но ошибки не возникло.

Так что главная проблема здесь в EventMap.js, потому что, когда я пытался удалитьEventMap.js в моем startTabBasedApp (главные вкладки), затем удалите приложение, запустите react-native run-android, откройте приложение, перейдите на вкладки (2), оно работает нормально.

Что я пытаюсь сделать в моем приложенииКогда пользователь открывает его и переходит в EventMap.js, я хочу мгновенно получить местоположение пользователя, как в приложении Grab.

Как мне добиться этого, не разрывая приложение?

Вот мои коды для EventMap.js

class EventMap extends Component {
constructor(props) {
  super(props);

this.state = {
  focusedLocation: {
    latitude: 0,
    longitude: 0,
    latitudeDelta: 0.01,
    longitudeDelta: Dimensions.get('window').width / Dimensions.get('window').height * 0.01
  },
  locationChosen: false,
  markerPosition: {
    latitude: 0,
    longitude: 0
  }
 }
}

componentDidMount() {
  this.didMountGetUserLocation();
};

//This is getting the location and exactly/automatically when they open
didMountGetUserLocation = () => {
  navigator.geolocation.getCurrentPosition(pos => {
    var lat = parseFloat(pos.coords.latitude)
    var long = parseFloat(pos.coords.longitude)

    var initialRegion = {
      latitude: lat,
      longitude: long,
      latitudeDelta: 0.01,
      longitudeDelta: Dimensions.get('window').width / Dimensions.get('window').height *0.01
    };

    this.setState({focusedLocation: initialRegion})
    this.setState({locationChosen: true})
    this.setState({markerPosition: initialRegion})
  },
  err => {
    console.log(err);
  });
};

pickLocationHandler = (event) => {
  const coords = event.nativeEvent.coordinate;
  //For animation of map
  this.map.animateToRegion({
    ...this.state.focusedLocation,
    latitude: coords.latitude,
    longitude: coords.longitude
  });
  this.setState(prevState => {
    return {
      focusedLocation: {
        ...prevState.focusedLocation,
        latitude: coords.latitude,
        longitude: coords.longitude
      },
      locationChosen: true
    };
  });
};

getLocationHandler = () => {
  navigator.geolocation.getCurrentPosition(pos => {
    const coordsEvent = {
      nativeEvent: {
        coordinate: {
          latitude: pos.coords.latitude,
          longitude: pos.coords.longitude
        }
      }
    };
    this.pickLocationHandler(coordsEvent);
  },
  err => {
    console.log(err);
    alert("Fetching failed");
  })
};

render() {
  let marker = null;
  if(this.state.locationChosen) {
    marker = <MapView.Marker coordinate={this.state.markerPosition}/>
  }
  return(
    <View style={{zIndex: -1}}>
     <TouchableOpacity onPress={this.getLocationHandler} style={styles.iconContainer}>
        <Icon name="md-locate" size={30} color="blue"/>
      </TouchableOpacity>
      <MapView
        style={styles.map}
        initialRegion={this.state.focusedLocation}
        onPress={this.pickLocationHandler}
        showsUserLocation={true}
        ref={ref => this.map = ref} //For animating map movement
      >
        {marker}
      </MapView>
    </View>
  );
}
}