反应传单更新标记

Question

你好，我是传单新手，我正在使用地图组件构建应用。用户每次执行特定操作（过滤器）时，地图上的标记都应更新。该组件工作正常。然后我决定从原始的Leaflet中添加响应式弹出插件。所以我调整了反应传单的正常部分。现在，每次执行新过滤器时，都会将新标记成功添加到地图，但是不会删除旧标记。

codesandbox demo

有关如何解决此问题的任何帮助？

Answer 1

如果您未绑定到该组件（“ leaflet-sensitive-popup”），则可以这样解决（首选解决方案）： CodeSandbox without ResponsivePopup

<Marker key={i} position={bus}>
  <Popup>
    <span>Note<br />{i}</span>
  </Popup>
</Marker>

如果您必须使用该组件，则必须在阵列中存储标记并清除所有标记，然后再添加新标记，如下所示： CodeSandbox with ResponsivePopup 问题是您要添加标记，而从不删除旧标记。您必须传递所有坐标，以便首先可以删除旧坐标，然后再添加新坐标。