获取地理位置后,React-Native-Maps似乎不会重新渲染

Question

我正在尝试创建一个加载谷歌地图的简单应用程序(使用airbnb的react-native-maps库)并显示用户的当前位置.我所看到的是,一旦获得用户的位置,地图总是显示默认的初始位置而不是重新渲染.

我正在使用React 0.42并仅在iOS上进行测试.以下是一些澄清的代码:

1.)我设置了一个初始状态

state = {
      region: {
        latitude: 52,
        longitude: 5,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421
      }
  }

2.)我在componentDidMount中获取用户的位置

componentDidMount() {
    navigator.geolocation.getCurrentPosition(
      (position) => {
        this.setState({
          region: {
            latitude: position.coords.latitude,
            longitude: position.coords.longitude,
            latitudeDelta: 0.01,
            longitudeDelta: 0.0011
          }
        });
      },
      (error) => alert(JSON.stringify(error)),
      {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
    );
  }

3.)使用渲染,我显示具有初始区域的地图,并期望一旦获取用户的位置就改变该区域

render() {
    return (
     <View style={{ flex: 1 }}>
       <View style={{backgroundColor: 'coral', height: 70, justifyContent: 'center', alignItems: 'center'}}>
         <Text>
            <Text>longitude: {this.state.region.longitude}</Text>
            <Text>latitude: {this.state.region.latitude}</Text>
        </Text>
       </View>
       <View style={styles.container}>
         <MapView
           provider={PROVIDER_GOOGLE}
           style={styles.map}
           initialRegion={this.state.region}
           region={this.state.region}
           onRegionChange={this.onRegionChange}
           onRegionChangeComplete={this.reloadEntities}
         />
       </View>
     </View>
   );
 }

这是onRegionChange,只是用新区域更新状态,我相信这将导致重新渲染

onRegionChange = (region) => {
  this.setState({ region });
}

注意:经度和纬度文本值会随着地图上的区域更改而更新,并且一旦获取用户的位置,它们就会更新.

所以我有点困惑的是,为什么一旦获得用户的位置,地图不会改变它所显示的内容.任何帮助将非常感激!

更新:我已经看过这个帖子:https://github.com/airbnb/react-native-maps/issues/43它似乎主要围绕Android,但我确实尝试删除enableHighAccuracy选项没运气.

Answer 1

摆脱 也很重要onRegionChangeComplete={this.reloadEntities}。

每次区域更改时，react-native 都会重新加载并默认返回到您在构造函数中声明的初始状态。