Error while updating property 'coordinate' of a view managed by: AIRMapMarker

Question

I am trying to run code which supposed to get my location in maps. here's my code App.js

import React, { Component } from "react";
import { Platform, Text, View, StyleSheet } from "react-native";
import Constants from "expo-constants";
import * as Location from "expo-location";
import MapView, { Marker } from "react-native-maps";

export default class Geolocation extends Component {
  state = {
    location: null,
    region: null,
    errorMessage: "",
  };
  UNSAFE_componentWillMount() {
    if (Platform.OS === "android" && !Constants.isDevice) {
      this.setState({
        errorMessage:
          "Oops, this will not work on Sketch in an Android emulator. Try it on your device!",
      });
    } else {
      this._getLocationAsync();
    }
  }
  _getLocationAsync = async () => {
    let { status } = Location.requestPermissionsAsync;
    if (status !== "granted") {
      this.setState({
        errorMessage: "Permission to access location was denied",
      });
    }
    let location = await Location.getCurrentPositionAsync({});
    const region = {
      latitude: location.coords.latitude,
      longitude: location.coords.longitude,
      latitudeDelta: 0.001,
      longitudeDelta: 0.001,
    };
    this.setState({ location, region });
  };
  render() {
    return (
      <MapView
        style={{
          flex: 1,
          alignItems: "center",
          justifyContent: "center",
          paddingTop: Constants.statusBarHeight,
        }}
        initialRegion={this.state.region}
      >
        {" "}
        <Marker coordinate={this.state.region} />{" "}
      </MapView>
    );
  }
}

after I run the code, there are errors like this:

and this in my command

Please help me. Thank you

I tried to reinstall dependencies, read documentation in react and still didn't find the solution.