javascript - onUserLocationChange 更改 React Native map 区域

Question

我正在使用“react-native-maps”中的 MapView

我无法显示“showsMyLocationButton”，所以我正在实现自己的。

我想在不使用 React Native 的地理定位的情况下执行此操作，因为我发现它比 react-native-maps prop showsUserLocation 慢。我使用返回坐标的 onUserLocationChange 事件。但是，当触发 onUserLocationChange 事件并设置包含 userLocation 的状态时，它会自动更新区域，而无需我明确要求。

这是我的代码:

display_my_location(coordinate){
  alert("region changed")
  this.setState({
    region: {
      latitude: coordinate.latitude,
      longitude: coordinate.longitude,
      latitudeDelta: 0.004,
      longitudeDelta: 0.004
    },
  });
}

setUserLocation(coordinate){
  //alert("User location changed MAP SHOULDNT MOVE")
  this.setState({
    userLocation: {
      latitude: coordinate.latitude,
      longitude: coordinate.longitude,
      latitudeDelta: 0.004,
      longitudeDelta: 0.004
    }
  })
}

<MapView
      style={styles.map}
      showsMyLocationButton={true}
      onUserLocationChange={locationChangedResult => this.setUserLocation(locationChangedResult.nativeEvent.coordinate)}
      initialRegion={this.state.region_amon}
      showsUserLocation={true}
      region={this.state.region}
      mapType={this.state.map_style}
      showsCompass = {true}
      showsMyLocationButton={true}
      chacheEnabled={false}
      zoomEnabled={true}

Answer 1

我相信您可以通过从 MapView 中完全删除 region 属性来解决这个问题。如果您需要以编程方式更改 map 的边界框，您可以将 ref 附加到 map 并使用此处适当的 MapView 方法在 componentDidUpdate 中更新:

https://github.com/react-community/react-native-maps/blob/master/docs/mapview.md#methods