Функция Flyto не работает с динамической позицией ⇐ Javascript

[Anonymous]

Я работаю над проектом React, где я отображаю несколько маркеров на карте листовок. Я добавил две кнопки на своей карте. Один из них должен летать в положение выбранного маркера, когда я нажимаю на него. Поэтому я передаю позицию маркера (реализованную как переменную состояния в моем основном компоненте) компонент кнопки и использую его в моей функции OnClick. В мою позицию по умолчанию, когда маркер не выбран, но когда я изменяю маркер (и поэтому в положение) и нажимаю кнопку, он не летит в нужную позицию. < /p>
import {useEffect} from "react";
import {createRoot} from "react-dom/client";
import {useMap} from "react-leaflet";
import L from "leaflet";
import locateIcon from '../assets/my-location.svg'
import routeIcon from '../assets/route.svg'
import '../components/IconButton.css'

export default function CustomControls({position}) {

// Add icons
const LocateControlIcon = () =>

;
const RouteControlIcon = () =>

;

const map = useMap();

// Functionality buttons
function handleLocateButton() {
console.log('Fly to: ' + position);
map.flyTo(position);
}

function handleRouteButton() {
alert('Button clicked!');
}

useEffect(() => {

const CustomControl = L.Control.extend({
position: "topright",

onAdd: () => {
const container = L.DomUtil.create('div', 'custom-control');
container.style.margin = '16px 16px 0 0';

const locateButton = L.DomUtil.create('button', 'icon-button', container);
locateButton.onclick = handleLocateButton;

const routeButton = L.DomUtil.create('button', 'icon-button', container);
routeButton.style.margin = '8px 0 0 0';
routeButton.onclick = handleRouteButton;

// Render icons in the buttons
createRoot(locateButton).render();
createRoot(routeButton).render();

L.DomEvent.disableClickPropagation(container);

return container;
},
});

const controlInstance = new CustomControl();
map.addControl(controlInstance);

return () => {
map.removeControl(controlInstance);
};

}, [map]);

return null;
}


Подробнее здесь: https://stackoverflow.com/questions/793 ... c-position