Google maps React Native-元素类型无效：应为字符串

我想在我的应用程序中根据一些坐标显示一个静态地图

我正在使用以下库：

我已经做了以下工作：

npm安装--保存本地谷歌静态地图

并在我的视图中添加了以下内容：

var GoogleStaticMap=require（'react-google-static-map'）

及

您需要执行以下操作之一

使用以下任一方法导入
GoogleStaticMap
：

var GoogleStaticMap = require('react-native-google-static-map').default;

或

你能分享你在该页面的完整代码吗？@TusharKhatiwada请查看我的更新！非常感谢你的回答。请告诉我，我很想知道您是如何知道或发现问题的：）
import React, { Component } from 'react'; import { View } from 'react-native';

import {
  AppRegistry,
  StyleSheet,
  Text,
  TextInput,
  TouchableHighlight,
  ActivityIndicator,
  NavigatorIOS,
  ListView,
  Image,
  WebView,

} from 'react-native';

var GoogleStaticMap = require('react-google-static-map');


class Single extends Component {
  render() {
    return (

      <Image style={styles.container} source={require('../../images/home.jpg')}>
          <View style={styles.map}>
          <GoogleStaticMap
            style={styles.map}
            latitude={'32.064171'}
            longitude={'34.7748068'}
            zoom={13}
            size={{ width: 300, height: 550 }} />

              <View style={styles.business}>
                <Text style={styles.businessName}>{this.props.property.street_address} {this.props.property.postcode}</Text>
              </View>
              <View style={styles.overview}>
                <Text style={styles.heading}>
                  Overview
                </Text>

                <Text style={styles.bodyText}>{this.props.property.overview}</Text>
              </View>

              <View style={styles.overview}>
                <Text style={styles.heading}>
                  Opening Hours
                </Text>

                <Text style={styles.bodyText}>Monday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Tuesday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Wednesday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Thursday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Friday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Saturday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
                <Text style={styles.bodyText}>Sunday &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {this.props.property.opening_hours.monday_open} - {this.props.property.opening_hours.monday_close}</Text>
              </View>
           </View>
      </Image>

    )
  }

}

const styles = StyleSheet.create({

    business: {
      backgroundColor: 'rgba(0,0,0,0.5)',
      marginTop: 10,
    },
    businessName: {
      fontSize: 14,
      padding:10,
      color: '#ffffff'
    },
    map: {
      flex: 1,
      marginTop: 30,
      width: null,
      height:10,
    },
    overview: {
      marginTop: 30,
      left:0,
      height:null,
      backgroundColor: 'rgba(0,0,0,0.5)',

    },
    bodyText: {
      color: '#ffffff',
      padding: 10,
    },
    heading: {
      padding:5,
      backgroundColor: '#008983',
      color: '#ffffff'

    },
    container: {
      flex: 1,
      marginTop: 50,
      width:null,
      height:null,

    },

    backdropView: {
      top:100,
      height: 200,
      width: 320,
      backgroundColor: 'rgba(0,0,0,0.5)',
    },
    headline: {
      fontSize: 20,
      textAlign: 'center',
      padding:40,
      backgroundColor: 'rgba(0,0,0,0)',
      color: 'white'
    },
    backdropViewTitle: {
        color: 'white',
        textAlign: 'center',
        padding:10,
        fontSize: 20,

    },
    search: {
      height:50,
      fontSize: 15,
      borderWidth: 1,
      borderColor: '#fff',
      borderRadius: 1,
      color: '#fff',
      width:295,
      marginTop:10,
      marginLeft:10,
      padding:10
    },

    content:{
        backgroundColor:'#ebeef0',
        flex:1,
        alignItems:'center'     //<-----
    },
    messageBoxTitleText:{
        fontWeight:'bold',
        color:'#fff',
        textAlign:'center',
        fontSize:20,
        marginBottom:10
    },
    messageBoxBodyText:{
        color:'#fff',
        fontSize:16
    },
    logo: {
      top:50,


    },
    welcome: {
      fontSize: 20,
      textAlign: 'center',
      margin: 10,
    },
    instructions: {
      textAlign: 'center',
      color: '#333333',
      marginBottom: 5,
    },

    flowRight: {
      flexDirection: 'row',
      alignItems: 'center',
      width: 300,
      left:60
    },
    buttonText: {
      fontSize: 18,
      color: 'white',
      alignSelf: 'center'
    },
    button: {
      top:10,
      left:10,
      height: 40,
      width:100,
      flexDirection: 'row',
      backgroundColor: '#48BBEC',
      borderColor: '#48BBEC',

      marginBottom: 10,
      alignSelf: 'stretch',
      justifyContent: 'center'
    },
    searchLocation: {
      height: 36,
      padding: 4,
      marginRight: 5,
      flex: 5,
      fontSize: 10,
      borderWidth: 1,
      borderColor: '#48BBEC',
      borderRadius: 8,
      color: '#48BBEC',

    },

    searchInput: {
      height: 36,
      padding: 4,
      marginRight: 5,
      flex: 4,
      fontSize: 10,
      borderWidth: 1,
      borderColor: '#48BBEC',
      borderRadius: 8,
      color: '#48BBEC'
  },

});
module.exports = Single;

var GoogleStaticMap = require('react-native-google-static-map').default;

import GoogleStaticMap from 'react-native-google-static-map';