Android (RN)：如何在渲染前设置 MapView 的纬度/经度？获取区域更新错误答案

【问题标题】：Android (RN): How to set lat/long of MapView before render? Getting region update errorAndroid (RN)：如何在渲染前设置 MapView 的纬度/经度？获取区域更新错误
【发布时间】：2016-07-30 02:18:04
【问题描述】：

我是 RN 的初学者，我在使用 MapView 和 geolocalizer 时遇到了一些问题。有人可以帮忙吗？它实际上是两个问题：我想知道移动地理位置并用它的纬度/经度渲染地图。所以，这就是我正在尝试的：使用 componentWillMount 函数通过建议的代码获取地理位置：（使用它尝试在渲染之前使用坐标设置状态）

navigator.geolocation.getCurrentPosition(
(position) => {
var initialPosition = JSON.stringify(position);
this.setState({initialPosition});
},
(error) => alert(error.message),
{enableHighAccuracy: true, timeout: 20000, maximumAge: 1000} 
);

状态 initialPosition 设置正确，但我还需要设置纬度和经度状态，因为 JSON.stringify(position) 是具有许多其他属性的字符串，所以我该怎么做 x = position (of the function)或 x = navigator.geolocation 返回，因为当我尝试在 this.setState 之后放置一个 var x = initialPosition （处理并仅从 x 获取纬度/经度之后），它不会收到任何值，就像代码直到componentWillMOunt 结束。 IDK。

我为什么要尝试这个？因为当我尝试使用初始化状态的新纬度/经度重新渲染 Mapview 时，我收到此错误：

Android：更新由 AIRMap 管理的视图的属性“区域”时出错： https://github.com/lelandrichardson/react-native-maps/issues/140

注意：我确实有 lat/long Delta，正如帖子所建议的（不是我的帖子）我怎样才能做到这一点？如果我想做的方式也是可能的，那么任何建议都将不胜感激。谢谢！

【问题讨论】：

标签： geolocation react-native android-mapview

【解决方案1】：

您可以在 componentDidMount() 中设置当前位置。

componentDidMount() {
    navigator.geolocation.getCurrentPosition(
        position => {
            this.setState({
                region: {
                    latitude: position.coords.latitude,
                    longitude: position.coords.longitude,
                    latitudeDelta: 0.0922,
                    longitudeDelta: 0.0422,
                }
            });
        },
        (error) => console.log(error.message),
        { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 },
    );
}

在渲染中，使用如下：

<MapView
    provider={PROVIDER_GOOGLE}
    style={StyleSheet.absoluteFillObject}
    region={this.state.region}/>

【讨论】：

【解决方案2】：

您需要 latDelta 和 lonDelta。如果没有运行，添加更多

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

进入android/app/src/main/AndroidManifest.xml

【讨论】：