如何使用 React Leaflet 放置加载事件处理程序？

Question

我需要有关基于地图的应用程序的反应传单的帮助。我正在尝试添加一个加载函数，一旦客户端登录到地图，该函数就会在加载时执行。但在react-leaflet上，没有onLoad.

现在我只有这个：

function CenterCoords() {
    const map = useMapEvents({
        // TODO resolve onload
        layeradd() {
            map.locate()
            console.log('loading')
        },
        locationfound(e: any) {
            map.flyTo(e.latlng, map.getZoom())
        },
    })
    return null
}

我只使用了layeradd，但我不知道这意味着什么，并且react-leaflet文档没有提供有关其传单处理函数的提示。如果我依赖传单文档，load似乎loading不起作用。

Answer 1

该MapContainer组件采用一个whenReadyprop，这是一个在地图准备好时触发的函数。它还需要一个whenCreatedprop，它是底层传单实例的函数L.map。但你可以用它做任何你想做的事：

<MapContainer
  center={center}
  zoom={zoom}
  scrollWheelZoom={false}
  whenReady={() => {
    console.log("This function will fire once the map is created")
  }}
  whenCreated={(map) => {
    console.log("The underlying leaflet map instance:", map)
  }}>
    ...
</MapContainer>

load事件loading更特定于图层，例如tileLayers或imageLayers。