reactjs - 在反应传单中向多边形添加弹出窗口

Question

我需要将弹出窗口添加到将要绘制的多边形中。

代码：

function App() {

  const bounds = [[0, 0], [256, 256]]

  const created = (e) => {
    console.log(e);
  }

  return (
    <div className="App">
      <h1>SmartClean</h1>
      <Map
      bounds={bounds} zoom={-4} scrollWheelZoom={false} crs={L.CRS.Simple}
      >
      <FeatureGroup>
        <EditControl position="topright" draw={{rectangle:false,circle:false,marker:false,circlemarker:false,polyline:false}} onCreated={created}/>
      </FeatureGroup>
        <Marker position = {[256,256]} >
          <Popup>
          Bathroom
          </Popup>
        </Marker>
        <ImageOverlay
          bounds={bounds}
          url="https://beamtech-file.s3.amazonaws.com/company/3/6dcbca6e-574d-410b-b732-b6ba0865ed06-hermitage-standard-lhs-2546x1900_0.png"
        />
      </Map>
    </div>
  );
}

在这里，用户可以在 EditControl 的帮助下随时随地绘制多边形。我需要在创建多边形后立即添加一个标记或一个弹出窗口。我尝试使用 react-leaflet 中的 Marker 和 Popup 组件，但它需要到不同的位置。将边界传递到位置会引发错误。