Leaflet 如何在react手册v3中绘制形状

您是否知道如何实现react-V3的绘图功能？ 我添加了一个事件侦听器，但它不工作，对任何事情都没有反应

useffect（（）=>{
如果（！map）返回；
map.addEventListener（“mousemove”，函数（事件）{
setCoords（{lat:event.latlng.lat，lng:event.latlng.lng}）；
});
map.on（“draw:drawstart”），函数（事件）{
日志（“此处事件”，事件）；
});
const drawControl=新的L.Control.Draw({
位置：“左上角”，
});
drawControl.addTo（map）；
const leftLayer=L.tileLayer(
图层[leftLayerIndex].url，
分层
).addTo（地图）；
常量rightLayer=L.tileLayer(
图层[rightLayerIndex].url，
分层
).addTo（地图）；
const sbs=L.control.sideBySide（leftLayer，rightLayer）.addTo（map）；
并排设置（sbs）；
}，[地图]；
useffect（（）=>{
如果（并排）{
sideBySide.setLeftLayers(
L.tileLayer（图层[leftLayerIndex].url，图层选项）.addTo（地图）
);
}
}，[leftLayerIndex，rightLayerIndex，sideBySide]；

这是对我有效的代码。我添加了一个事件侦听器，用于侦听创建的图层，创建图层后，我添加了要素组图层。我已经提到这部分是必需的，正如我在options对象中所评论的那样

编辑：{
featureGroup:editableLayers，//必需！！
}

useffect（（）=>{
如果（！map）返回；
map.addEventListener（“mousemove”，函数（事件）{
setCoords（{lat:event.latlng.lat，lng:event.latlng.lng}）；
});
const editableLayers=新的L.FeatureGroup（）；
map.addLayer（可编辑层）；
常量选项={
位置：“左上角”，
抽签：{
多段线：false，
多边形：错，
矩形：{
形状选项：{
可点击：false，
颜色：“道奇蓝”，
},
},
},
编辑：{
featureGroup:editableLayers，//必需！！
},
};
const drawControl=新的L.Control.Draw（选项）；
map.addControl（drawControl）；
map.on（L.Draw.Event.CREATED，函数（e）{
变量类型=e.layerType，
层=e层；
如果（类型==“标记”）{
bindPopup（“弹出窗口！”）；
}
editableLayers.addLayer（层）；
});
const leftLayer=L.tileLayer(
图层[leftLayerIndex].url，
分层
).addTo（地图）；
常量rightLayer=L.tileLayer(
图层[rightLayerIndex].url，
分层
).addTo（地图）；
const sbs=L.control.sideBySide（leftLayer，rightLayer）.addTo（map）；
并排设置（sbs）；
}，[地图]；

您能否提供一个代码沙盒来演示您遇到的问题？帮助会容易得多，因为您提供的代码没有任何明显的问题。我已经找到了将listener添加到draw插件的解决方案，但还有一个问题我不清楚，图标没有呈现在那里。是我的问题的示例代码。我会修改你的问题，以反映你所问问题的变化。我看你可以开始画画了，但画完一幅画，它就消失了。您还需要为

editable:drawing:end

创建一个事件，以捕获完成的形状并将其添加到地图谢谢，这对我帮助很大。亮液