Закрыть baloon placemark по клику на карту а не на крестик самого baloon в react-yandex-map
Вот код кому интересно и есть время помочь https://codesandbox.io/s/l7oqnz7mml
Ответы (2 шт):
Автор решения: frozencoast
→ Ссылка
Не знаю, как закрыть balloon корректно через API, но нашёл решение, которое работает в вашем случае:
function closeCurrentBalloon() {
let close = document.querySelector('ymaps[class$="-balloon__close-button"]');
if (close != null) {
close.click();
}
}
function App() {
return (
<div className="App">
<YMaps>
<Map state={mapState} onClick={closeCurrentBalloon}>
...
</Map>
</YMaps>
</div>
);
}
Для наглядности: https://codesandbox.io/s/react-yandex-maps-issue-101-9s5q1
Автор решения: Сергей Савельев
→ Ссылка
В реакте нужно получить instanceRef компонента YMap и Placemark, после навесить событие при клике на карту для закрытия балуна:
const [map, setMap] = useState();
const [placemark, setPlacemark] = useState();
useEffect(() => {
if (!map || !placemark) {
return;
}
map.events.add('click', () => placemark.balloon.close());
}, [map, placemark]);
<YMaps query={{load: 'package.full'}}>
<YMap
instanceRef={setMap}
{...yMapProps}
>
<Placemark
instanceRef={setPlacemark}
{...yMapPlacemarkProps}
>
</YMap>
</YMaps>