Javascript 按标记显示错误的标注和标记

我正在使用Expo 39.0.2和react native maps 0.27.1（撰写本文时的最新版本）。我使用

Marker

s和

Callout

s在地图上显示点及其信息。但是，每当我单击一个

标记

，就会显示另一个

标注

，并且原始的

标记

也会被替换，但是当我关闭

标注

时，

标记

又回来了。这在iOS和Android上都会出现

（代码大大简化，因此可能缺少一些函数）

import React，{useState，useffect，useRef}来自'React'；
从“react native”导入{View，Dimensions}；
从“react native maps”导入地图视图，{UrlTile，Marker，Callout}
从“本机基”导入{Text}；
从“../config.json”导入配置；
函数映射屏幕（{navigation}）{
const width=Dimensions.get（'window'）.width；
const height=维度.get（'window'）。高度；
常量初始值区域={
纬度：23.56621，
经度：120.96666，
latitudeDelta:3，
长德尔塔：3，
}
const MAP_TYPE=Platform.OS=='android'？'none'：'standard'；
常量urlTemplate=http://c.tile.openstreetmap.org/{z} /{x}/{y}.png'；
const[stations\u info，set\u stations\u info]=useState（[]）；
useffect（（）=>{
获取（config.request.hostname+config.request.api_前缀+“/站”{
方法：“获取”
})
.then（（response）=>response.json（））
。然后（（数据）=>{
data=data.map（（值）=>{
value.name=value.device；
value.show=true；
value.color=确定颜色的函数（value.record）；
返回值；
});
设置站点信息（数据）；
})
.catch（（错误）=>{
控制台错误（error）；
});
}, []);
const mapRef=useRef（）；
返回(
{
站点信息过滤器（v=>v.show）.map（（站点，索引）=>(
navigation.navigate（'Info'，{station\u id:station.id，name:station.name}}>
站点：{Station.name}
{
Object.entries（station.record）.map（（值、键）=>(
{value[0]}:{value[1]}
))
}
单击以查看更多信息
))
}
);
}

---

以上面的GIF为例，标记是红色的，但当单击标记时，它会变为黄色，并且标注没有显示正确的信息（此标注应属于另一个标记），关闭后，标记的颜色再次正确。

我想我已经知道发生了什么

---

问题是，当多个标记共享完全相同的经度和纬度时，不能保证按下标记只会触发最上面的标记的按下，而可能触发多个事件。解决方法是，要么确保每个标记都有一个不同的位置，要么在重叠标记上添加一个小偏移量。

我想我已经知道发生了什么

问题是，当多个标记共享完全相同的经度和纬度时，不能保证按下标记只会触发最上面的标记的按下，而可能触发多个事件。解决方法是，确保每个标记都有一个不同的位置，或者为重叠标记添加一个小偏移量