Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object

I am getting this error:- Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

This is my code:–

// @flow ‘use strict’;

import React, { Component } from ‘react’; import { View } from ‘react-native’; import GooglePlacesAutocomplete from ‘react-native-google-places-autocomplete’; import { Actions } from ‘react-native-router-flux’;

// Styles import * as googlePlacesStyle from ‘…/googleplaces/style’;

export default class GooglePlacesScene extends Component {

  state: {
    homePlace?: {
        description: string,
        geometry: {
            location: {
                lat: number,
                lng: number
            }
        }
    },
    workPlace?: {
        description: string,
        geometry: {
            location: {
                lat: number,
                lng: number
            }
        }
    }
};

constructor(props: {}) {
    super(props);

    this.state = {  homePlace: { description: 'Home', geometry: { location: { lat: 48.8152937, lng: 2.4597668 }}},
                    workPlace: {description: 'Work', geometry: { location: { lat: 48.8496818, lng: 2.2940881 } }}};
}

render() {
    return(
     <View style={googlePlacesStyle.bodyStyle}>
         <GooglePlacesAutocomplete
            placeholder='Search'
            minLength={2}
            autoFocus={false}
            fetchDetails={true}
            onPress={(data, details = null) => {
                console.log(data);
                console.log(details);
            }}
            getDefaultValue={() => {
                return ''; // text input default value
            }}
            query={{
                key: 'ALaiPuRiT3eyqE9CDhjjklAD2179Pw1uRoeVfBq',
                language: 'en',
                types: '(cities)',
            }}
            styles={{description: {
                fontWeight: 'bold',
            },
            predefinedPlacesDescription: {
                color: '#1faadb',
            },
        }}
        currentLocation={true}
        currentLocationLabel="Current location"
        nearbyPlacesAPI='GooglePlacesSearch'
        GoogleReverseGeocodingQuery={{
        }}
        GooglePlacesSearchQuery={{
            rankby: 'distance',
            types: 'food',
        }}
        filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']}
        predefinedPlaces={[this.state.homePlace, this.state.workPlace]}
       />

    </View>
    );
}

}

[mayask]

@GuelorEmanuel

Look at the way you import the component:

import GooglePlacesAutocomplete from 'react-native-google-places-autocomplete';

It should be imported like this

import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';

[mayask]

Hi @davidgruebl @janroures @GuelorEmanuel

Thanks for your feedback. I promise to look at it this weekend.

Max