react-native-maps: animateToRegion does not work with region

Question

简而言之:为什么animateToRegion不能与region或initialRegion一起工作?

我已经测试了这种行为，并注意到animateToRegion在使用useEffect() =>{}， []);
但是如果我添加一个简单的按钮与功能到animateToRegion然后animateToRegion与region或initialRegion将工作。如果我在MapView上使用animateToRegion onPress/onLongPress

下面的代码是MapView的基本用法。fitToMarker()基本上从用户或默认位置获取位置，然后将它们传递给animateToRegionHolder()。

const mapRef = React.useRef<MapView | null>(null);

const animateToRegionHolder = (lat: number, lng: number) => {
if (mapRef.current) {
mapRef.current.animateToRegion(
{
latitude: lat,
longitude: lng,
latitudeDelta: 0.2,
longitudeDelta: 0.0421,
},
1000,
);
}
};
<MapView
ref={mapRef}
onMapReady={fitToMarker}
style={[S.MapsStyles.mapView, defineMapContainerStyle()]}
/**
* This for some reason affects that fitToMarker will not work
* But removing this will affect slight animation (which is not desired) on initial render
* initialRegion={O.region}
*/
>
<MapView>

"expo"^ 43.0.0"
"react-native-maps":"0.28.0",

为读者提供解决方案
由于使用onMapReady和initialRegion而发生问题。有条件地使用onRegionChangeComplete解决了这个问题:
当需要拖拽地图时不使用，但当需要初始animateToRegion时，使用.

Answer 1

尝试使用useRef代替。下面是一个工作示例:

const mapRef = React.useRef<MapView >(null);

<MapView
ref={mapRef}
initialRegion={initialRegion}
onRegionChangeComplete={handleRegionChange}
/>

mapRef.current?.animateToRegion({
latitude: selectedCoordinates.lat,
longitude: selectedCoordinates.lng,
longitudeDelta: 0.004,
latitudeDelta: 0,
});