如何在react native中滚动地图时在地图上拖动点

import React, { useState } from 'react';
import { View, StyleSheet } from 'react-native';
import MapView, { Marker } from 'react-native-maps';

const MapWithDraggableMarker = () => {
  const [markerCoordinate, setMarkerCoordinate] = useState({
    latitude: 0, // 设置初始纬度
    longitude: 0, // 设置初始经度
  });

  // 当拖动地图时，更新标记的坐标
  const onMapDrag = (e) => {
    const { latitude, longitude } = e.nativeEvent.coordinate;
    setMarkerCoordinate({ latitude, longitude });
  };

  return (
    <View style={styles.container}>
      <MapView
        style={styles.map}
        onRegionChangeComplete={onMapDrag} // 监听地图的拖动事件
      >
        <Marker
          draggable
          coordinate={markerCoordinate}
          onDragEnd={onMapDrag} // 监听标记的拖动事件
        />
      </MapView>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  map: {
    flex: 1,
  },
});

const App = () => {
  return (
    <View style={styles.container}>
      <MapWithDraggableMarker />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});