从传单地图中删除所有 divIcon，然后恢复它们

如何解决从传单地图中删除所有 divIcon，然后恢复它们

我想在缩放级别

    <MapContainer className="leaflet-map" center={[latitude,longitude]}
        zoom={17} scrollWheelZoom={false}
        whenCreated={(map) => this.setState({ map })}>
        <TileLayer
            attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
            url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
        />
    </MapContainer>

我尝试了 map._panes.markerPane.remove();，但在删除后无法添加其他标记

componentDidUpdate() {
    const { map } = this.state;

    map.on('zoomend',function () {
        var currentZoom = map.getZoom();
        if (currentZoom < 16) {
            //map._panes.markerPane.remove();
        } else {
                    L.marker(latitude,longitude],{
                        icon: new L.DivIcon({
                            className: 'my-div-icon',iconSize: [5,5],html: '<p class="my-div-span">' + name + '</p>'
                        })
                    })
                        .addTo(map);
        }
    });
}

解决方法

虽然我不完全了解您如何添加标记以及从何处获得纬度、经度和名称，但您必须将标记存储在数组中，然后使用地图引用将它们从地图中删除。 因此，如果我们考虑到在放大等于或大于 16 的地图级别时，否则您将使用相同的文本复制相同的标记，并且如果多次添加相同的文本，则该文本将变为粗体，您应该做类似的事情：

const markers = []; // here define an empty array
    
class Map extends Component {
      state = { map: null };
    
      componentDidUpdate(prevProps,prevState) {
        const { map } = this.state;
        map.on("zoomend",function () {
            var currentZoom = map.getZoom();
            console.log(currentZoom);
            if (currentZoom < 16) {
              markers.forEach((marker) => map.removeLayer(marker));
            } else {
              const marker = L.marker([latitude,longitude],{
                icon: new L.DivIcon({
                  className: "my-div-icon",iconSize: [5,5],html: '<p class="my-div-span">' + name + "</p>"
                })
              });
              markers.push(marker);
              marker.addTo(map);
            }
        });
      }
   ...
 }

如果标记小于 16，则删除所有存储的标记，否则将它们添加到地图和标记数组上。