Javascript 反应本地地图：什么'；实现可拖动标记的最佳方法是什么？

我有一个地图，我需要添加一个可拖动的标记，以允许用户选择一个点

如果我选择传统的方法

<MapView
initialRegion={{
....
}}>
    <Marker coordinate={this.state.coordinates} draggable />
</MapView

当此函数返回位置时，标记会移动到正确的点，但地图不会滚动到放置标记的区域，因为

initialRegion

在安装后不会更改区域

如果我使用

region

而不是

initialRegion

，则地图根本不会滚动，因为

onRegionChange

回调正在持续更改状态，并且可能与

region

属性冲突

解决所有问题的最佳方法是什么？

最好的方法是通过绝对定位将标记显示在屏幕中央

        <View style={styles.markerFixed}>
               <Icon
            style={{
              color: '#B11C01',
            }}
            size={30}
            name={'map-marker-alt'}
            solid
          />
        </View>

 markerFixed: {
    left: 0,
    right: 0,
    marginLeft: 0,
    marginTop: 0,
    position: 'absolute',
    top: '40%',
    alignItems: 'center',
  },

markerFixed：{
左:0,，
右:0,，
marginLeft:0，
玛金托普：0，
位置：'绝对'，
前几名：“40%”，
对齐项目：“居中”，
},

现在，您可以将地图拖动到任何位置。这将显示标记正在移动的效果。但地图实际正在移动。现在，使用onRegionChangeComplete函数将更新的latlang转换为地址。您可以在标记上方显示转换后的地址，如快照中所示

import Geocoder from 'react-native-geocoding';
 <MapView
            style={styles.mapStyle}
              provider={PROVIDER_GOOGLE}
              region={{
                latitude: lat,
                longitude: long,
                latitudeDelta: 0.0922 / 10,
                longitudeDelta: 0.0421 / 10,
              }}
              onRegionChangeComplete={this.onRegionChange}
            />

    convertToAddress() {
        let {lat, long} = this.state;
        if (this.state.firstIndication === 0) {
          this.setState({firstIndication: 1});
          return;
        }
        Geocoder.from(lat, long)
          .then(json => {
            var addressComponent = json.results[0].address_components[0];
            this.setState({name: addressComponent.long_name});
          })
          .catch(error => console.warn(error));
      }[![enter image description here][1]][1]

从“react native geocoding”导入地理编码器；
convertToAddress（）{
设{lat，long}=this.state；
if（this.state.firstIndication==0）{
this.setState（{firstIndication:1}）；
返回；
}
地理编码器，从（纬度，长）
。然后（json=>{
var addressComponent=json.results[0]。address_components[0]；
this.setState（{name:addressComponent.long_name}）；
})
.catch（错误=>console.warn（错误））；
}[！[在此处输入图像描述][1][1]

最好的解决方法是使用

它为您提供了一个可拖动的地图，您可以轻松地通过标记选择任何位置

你可以参考

        <View style={styles.markerFixed}>
               <Icon
            style={{
              color: '#B11C01',
            }}
            size={30}
            name={'map-marker-alt'}
            solid
          />
        </View>

 markerFixed: {
    left: 0,
    right: 0,
    marginLeft: 0,
    marginTop: 0,
    position: 'absolute',
    top: '40%',
    alignItems: 'center',
  },

import Geocoder from 'react-native-geocoding';
 <MapView
            style={styles.mapStyle}
              provider={PROVIDER_GOOGLE}
              region={{
                latitude: lat,
                longitude: long,
                latitudeDelta: 0.0922 / 10,
                longitudeDelta: 0.0421 / 10,
              }}
              onRegionChangeComplete={this.onRegionChange}
            />

    convertToAddress() {
        let {lat, long} = this.state;
        if (this.state.firstIndication === 0) {
          this.setState({firstIndication: 1});
          return;
        }
        Geocoder.from(lat, long)
          .then(json => {
            var addressComponent = json.results[0].address_components[0];
            this.setState({name: addressComponent.long_name});
          })
          .catch(error => console.warn(error));
      }[![enter image description here][1]][1]