如何解决如何使用 React Leaflet 放置加载事件处理程序?
我的基于地图的应用程序需要有关 react-leaflet 的帮助。我正在尝试添加一个加载功能,一旦客户端登录到地图,该功能将在加载时执行。但是在 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
似乎不起作用。
解决方法
MapContainer
组件采用 whenReady
属性,这是一个在地图准备就绪时触发的函数。它还需要一个 whenCreated
道具,它是底层传单 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。
您可以在第一次渲染后使用 useEffect 来运行一些东西。使用空数组作为 useEffect 中的第二个参数只运行一次。
React.useEffect(() => {
myFunction();
},[]);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。