如何解决地图实例的 React-leaflet v3 和leaflet-contextmenu 插件问题
react-leavlet-v3 中没有可用的地图实例。
所以传单上下文菜单来自 https://github.com/aratcliffe/Leaflet.contextmenu 不工作。
解决方法
您可以使用 MapContainer 上的 whenCreated
道具获取地图实例
<MapContainer
className="markercluster-map"
center={currentLocation}
zoom={zoom}
maxZoom={18}
contextmenu={true}
contextmenuItems={[
{
text: 'Zoom in',callback: this.zoomIn
},{ text: 'Zoom out',callback: this.zoomOut }
]}
whenCreated={(map) => this.setState({ map })}
>
...
</MapContainer>
然后在您的事件侦听器上
zoomOut = () => {
const { map } = this.state;
...
}
zoomIn = () => {
const { map } = this.state;
...
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。