react-yandex-maps icon indicating copy to clipboard operation
react-yandex-maps copied to clipboard

Yandex maps are rendered twice React18 StrictMode

Open Kaptoiiika opened this issue 2 years ago • 7 comments

React 18 index.tsx

import React from 'react'
import ReactDOM from 'react-dom/client'
import { Map, YMaps } from 'react-yandex-maps'

const maState = {
  center: [55.751574, 37.573856],
  zoom: 5,
}

const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
root.render(
  <React.StrictMode>
    <YMaps>
      <Map defaultState={maState}></Map>
    </YMaps>
  </React.StrictMode>
)

Preview image

If i comment React.StrictMode

//<React.StrictMode>
    <YMaps>
      <Map defaultState={maState}></Map>
    </YMaps>
//</React.StrictMode>

i will get a normal work image

Kaptoiiika avatar Apr 18 '22 11:04 Kaptoiiika

Такая же проблема

StrongerMyself avatar Apr 27 '22 03:04 StrongerMyself

Также в моем случае интерактивным остается именно вторая карта, на первой не ставятся точки, только меняется масштаб и зум

StrongerMyself avatar Apr 27 '22 04:04 StrongerMyself

Пока грязным хаком спрятал первый

ymaps[class$="map"]:first-child:not(:last-child) {
    display: none;
}

StrongerMyself avatar Apr 27 '22 04:04 StrongerMyself

+1

proweb avatar Apr 27 '22 13:04 proweb

+1

kaptn3 avatar May 13 '22 10:05 kaptn3

https://stackoverflow.com/questions/61254372/my-react-component-is-rendering-twice-because-of-strict-mode

bartwork avatar May 13 '22 10:05 bartwork

+1

Loori-R avatar May 24 '22 23:05 Loori-R