How to make my popup open default useing react leaflet

23 Views Asked by At

I use react leaflet and I would like when my page is initialized the popup of my marker is opened by default. I tried to recover the marker with useRef but it doesn't work `

export default function App() {
  const [refReady, setRefReady] = useState(false);
  let MarkerRef = useRef();

  useEffect(() => {
    if (refReady == true) {
      MarkerRef.current?.openPopup();
    }
  }, [refReady]);

  return (
    <MapContainer
      whenReady={() => {
        setRefReady(true);
      }}

    >
        <Marker
          ref={MarkerRef}
          position={[0.4141754, 9.4655989]}
          icon={customIcon}
        >
          <Popup className="visible" closeButton={false}>
            This is popup 1
          </Popup>
        </Marker>
    </MapContainer>
  );
}

0

There are 0 best solutions below