ReactNative/Expo Error, Element type is invalid?

I am trying out some new project using MapView etc and I can’t understand why I am getting this error. “Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.” Everything should be good to compile so can someone please help me solve this! Any help is appreciated, thank you.

App.js:

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { MapView, Permissions, Location } from 'expo';

export default class App extends React.Component {
  constructor(props){
    super(props);
    this.state = {
    region: {
      latitude: 37.7885,
      longitude: -122.4324,
      latitudeDelta: 0.922,
      longitudeDelta: 0.0421,
    }
  }
}


  _getLocationAsync = async () => {
    let {status} = await Permissions.askAsync(Permissions.LOCATION);
      if(status !== 'granted')
        console.log('No se tienen permisos para acceder al gps');
    let location = await Location.getCurrentPositionAsync({enableHighAccuracy: true});
    
    let region={
      latitude: location.coords.latitude,
      longitude: location.coords.longitude,
      latitudeDelta: 0.0045,
      longitudeDelta: 0.0045,
    }
    this.setState({region: region})
  }
  render() {
    return (
      <View style={styles.container}>
       <MapView
          initialRegion ={this.state.region}
          showUserLocation={true} 
          showCompass={true}
          rotateEnabled={false}
          style={{flex: 1}}
        />        
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

Answer

The import for MapView comes from a separate package:

import MapView from 'react-native-maps';      

Leave a Reply

Your email address will not be published. Required fields are marked *