javascript - React Native Maps - 标记 onPress 调用多个事件

Question

当尝试在 onPress Marker 事件中调用多个事件时，我遇到了一个问题。

这个想法是：

• 将标记加载到地图中
• 使标记居中（单击）
• 根据选定的标记更新状态
• 调用表达式以打开底部工作表

这个例子效果很好，第一点和第二点

<Marker
key={i}
image={require('../assets/marker.png')}
onPress={() => 
  mapView.animateToRegion({
    latitude: Number(dev.lat),
    longitude: Number(dev.lng),
    latitudeDelta: 0.0432, 
    longitudeDelta: 0.0423
    },300)

}
calloutAnchor={{
    x: 0.6,
    y: 0,
}}
coordinate={{
  latitude: Number(dev.lat),
  longitude: Number(dev.lng),
}}
>

此示例仅调用函数 animateToRegion 即可正常工作，但如果替换为另一个函数以调用其他事件，则此特定事件无法按如下方式工作。

const bs = React.createRef()

function goto (index) {
    bs.current.snapTo(index) // reference to bottomsheet
}

function loadGaz(dev) {
    setSelectedGas(dev) // state update
}

function mapCenter (dev)  {
   mapView.animateToRegion({
      latitude: Number(dev.lat),
      longitude: Number(dev.lng),
      latitudeDelta: 0.0432, 
      longitudeDelta: 0.0423
   },300)     
}

function x (dev) {
   mapCenter (dev) // center marker into screen
   loadGaz(dev) // state to data into bottomsheet
   goto(0) //show bottom sheet
}

// If I remove others functions (loadGaz and goto) everything works fine.

<Marker
  key={i}
  image={require('../assets/marker.png')}
  onPress={() => x(dev)}
  calloutAnchor={{
    x: 0.6,
    y: 0,
  }}
  coordinate={{
    latitude: Number(dev.lat),
    longitude: Number(dev.lng),
  }}
>

好吧，我想我犯了一些错误，我要感谢你的支持..

感谢社区..

标签： javascriptreactjsreact-native