警告：道具类型失败：未指定必需的道具“region.latitude”答案

【问题标题】：Warning: failed prop type: Required prop 'region.latitude' was not specified警告：道具类型失败：未指定必需的道具“region.latitude”
【发布时间】：2017-04-07 13:12:28
【问题描述】：

我有一个问题，但我不知道它是否与此有关。

当我从 Android Studio 在 Android Emulator 上运行我的地图时，我收到了这个警告，我在 Palo alto 的 Google plex 上进行地理定位，而不是在我的实际地理位置上。是不是因为我用了模拟器？

如果你想检查，这是我的代码：

地图.js

import React, { Component } from 'react';
import Geolocation from '../geolocation/Geolocation';
import Shops from '../shops/Shop';
import {
  Text,
  View
} from 'react-native';
import MapView from 'react-native-maps';
import styles from './Style';

class Map extends Geolocation {

  render() {
    return (
      <View>
        <MapView style={styles.map}
        region={{
          latitude: this.state.position.coords.latitude,
          latitudeDelta: 0.001,
          longitude: this.state.position.coords.longitude,
          longitudeDelta: 0.001
        }} />
        <Shops />
      </View>
    );
  }
}

export default Map;

地理位置.js

import React, { Component } from 'react';
import styles from './Style';

class Geolocation extends Component {

    constructor(props) {
        super(props);
        this.state = {
            position : {
                coords: {}
            }
        }
    }

    componentDidMount() {
        navigator.geolocation.getCurrentPosition(
            (position) => {
                this.setState({position});
            },
            (error) => alert(error.message),
            {enableHighAccuracy: true, timeout: 20000}
        );
        navigator.geolocation.watchPosition((position) => {
            this.setState({position});
        });
    }
}

export default Geolocation;

如果您有任何想法，感谢您的回答，我对这个问题有点迷茫。

【问题讨论】：

标签： javascript reactjs react-native react-native-android

【解决方案1】：

我相信这是因为您从 this.state.position.cords 对象中分配了 MapView 坐标，在初始渲染时，cords.latitude 和 cords.longitude 的坐标是未定义的，因此会引发 propTypes 警告。

在构造函数中初始化它们以避免这种情况。

constructor(props) {
    super(props);
    this.state = {
        position : {
            coords: {
              latitude: 0,
              longitude: 0
            }
        }
    }
}

【讨论】：

【解决方案2】：

仅在 Android 中存在问题

解决方案：-

<MapView 
  initialRegion={{
    latitude: Number(letitude),
    longitude: Number(longitude),
    latitudeDelta: 0.0922,
    longitudeDelta: 0.0421
  }}
>

数字（你的让和长）它将转换成数字

【讨论】：

【解决方案3】：

可以更改经纬度。

从 Android Studio 启动 Android Device Monitor（工具 -> Android -> Android Device Monitor）

切换到 Emulator Control Tab 并在 Location Controls 组中进行更改。

【讨论】：