null不是对象（评估'_this $ state $ region.latitude'）

Question

在此代码中，我遇到一条错误消息，即null不是对象。当我单击按钮时。该应用程序崩溃，无法加载回此代码前面设置的位置。我正在使用react-native-maps库。在下面的代码中，我想查看工作正常的地图。但是当我单击按钮时，区域对象不起作用。

import React from 'react';
import MapView from 'react-native-maps';
import { StyleSheet, View, Dimensions,Permissions,Location } from 'react-native';
import Destinationbutton from './components/Destinationbutton';
import CurrentLocationButton from './components/CurrentLocationButton';
export default class App extends React.Component {
  constructor(props){
    super(props);
    this.state={
      region : null,
      }
      this._getLocationAsync();
      }
      _getLocationAsync = async () =>{
        let {status} = await Permissions.askAsync(Permissions.LOCATION);
        if (status !== 'granted')
        console.log('Permission to access location was denied.');
        let location = await Location.getCurrentPositionAsync({enableHighAccuracy : true});

        let region = {
          latitude :  location.coords.latitude,
          longitude : location.coords.longitude,
          latitudeDelta : 0.045,
          longitudeDelta : 0.045
        }
        this.setState({region: region}) 
      } 
    centerMap() {
        const { latitude,
             longitude,
             latitudeDelta,
             longitudeDelta } =  this.state.region ;

        this.map.animateToRegion({
            latitude,
            longitude,
            latitudeDelta,
            longitudeDelta
        })
    }      
  render() {
    return (
      <View style={styles.container}>
        <MapView
        initialRegion={this.state.region}
        showsUserLocation={true}
        showsCompass={true}
        ref={(map) =>{this.map = map }}
        rotateEnable={true}
        style={{flex:1,zIndex:0}}
      />
      <Destinationbutton />
      <CurrentLocationButton cb={() => { this.centerMap() }} />
      </View>
    );
  }}
const styles = StyleSheet.create({
  container: {
    flex:1,
    backgroundColor: '#fff',
    zIndex:0

  },
});