时间戳

首页 > 解决方案 > 有没有办法在 MapView.animateToRegion 方法停止后调用函数

javascript - 有没有办法在 MapView.animateToRegion 方法停止后调用函数

问题描述

我的 animateToRegion 方法存在问题，该方法应该放大到在动画期间由于调用其他函数而被截断的特定标记（或者至少这是我的假设）。

MapView 上的标记组件

<Marker
  key={index}
  ref={ref => (markers[index] = ref)}
  coordinate={{
    longitude: place.coordinates.lng,
    latitude: place.coordinates.lat
  }}
  onPress={() => {
    focusMarker(userRegion, place);
  }}
/>

调用的 focusMarker 函数：

  //Zoom on Marker Function
  focusMarker = (userRegion, place) => {
    mapRef.current.animateToRegion({
      latitude: vendor.coordinates.lat,
      longitude: vendor.coordinates.lng,
      latitudeDelta: 0.005,
      longitudeDelta: 0.005
    });

onPressEvents(userRegion, place);

};

我的 onPressEvents 函数按预期工作。当我尝试渲染它时，我的动画会在按下标记时开始，但会中断或断断续续，并且不会按预期放大。

如果我注释掉 onPressEvents 函数调用，它会按预期工作。地图居中并放大到标记。

有没有办法在调用 onPress 函数之前等待 animateToRegion 的动画完成？我试图避免使用 setTimeOuts。是否有我可以调用的动画停止方法，或者当动画停止时，然后调用该函数？

我有一个主类组件，它调用一些外部函数，这些函数在调用时呈现我的 MapView 和 Marker。当我在类组件的渲染方法中创建 MapView 和 Marker 时，似乎没有发生此问题。

谢谢

标签： javascriptreact-nativereact-native-maps

解决方案

我认为这是一个错误。我调整了主组件中的状态，并将其作为道具传递给渲染地图视图和标记组件的外部函数。它现在似乎没有障碍和重新缩放。我认为 MapView 的 ref 不断重新初始化，因此保持 mapRef 对象中的 __reactInternalSnapShotBEforeUpdate 道具指向原始区域坐标。我的函数一直在想我想创建一个新的 MapView 引用对象，而不是在第一次渲染屏幕时已经生成的现有对象上工作。

推荐阅读