Никак

Можно отрендерить вне границ экрана, померять, а потом отрендерить нормально. Но это тот еще гемор

можно как-то отключить чтобы в Chrome DevTools дебагер не лез в библиотеку реакт, а только по моему коду переходил когда f9 жму?

+ https://chrome.google.com/webstore/detail/api-response-simulator/apcdhhdefemipnmdedjfbchkecliimpc

Супер!! Спасибо

Всем привет, есть небольшая проблема, и неизвестно что ее вызывает

<StyledMapContainer isMain={isMain} >
 {imagesArr.array.map((img, number) => (
   <MapLink
     key={img.id}
     id={img.id}
     title={img.title}
     url={img.url}
     left={img.left}
     top={img.top}
     currentContext={img.id === intervalState[0].id}
     linkSpanClass={img.classes}
   />
 ))}
 <img
   className='main-image'
   src={mainImage}
   alt='Main'
   useMap='#mainPageMap'
   ref={mainImageNode}
 />
 {imagesArr.array.map((img) => (
   <img
     key={img.id}
     src={img.image}
     style={{
       opacity: img.id === intervalState[0].id ? 1 : 0,
     }}
   />
 ))}
 <map name='mainPageMap'>
   {imagesArr.array.map((img) => (
     <MapArea
       key={img.id}
       id={img.id}
       title={img.title}
       href={img.url}
       coords={img.coords}
       onFocus={{ setFocusedState, intervalState }}
     />
   ))}
 </map>
</StyledMapContainer>

создаю map и area, и на area висят ивенты onMouseEnter и onMouseLeave
Проблема заклучаеться в том, что иногда area как будто не сущевствует, они физически есть, но не привязаны к картинке и не срабатывает эфект миши и клика

Может поможет z-index и стоппропагинашен, но это не факт)

уже пробовал z-index, такое чувство что карта не применяеться на картинку

https://codesandbox.io/s/reactredux-forked-fo12h?file=/Page.js

Привет всем!
Помогите пж. Как бороться с таким состоянием гонки и как пихать правильное значение одного стэйта в другой стэйт не юзая хук useEffect?(юзать useEffect я не могу потому что сам стэйт значение которого надо записать в другой стэйт меняется чаще чем надо записывать, а тут я сильно упростил задачу)

Если можно пожалуйста то с примерами кода)

Проблема тут именно в функциях

 const increm = (value) => {
   incrementAction();
   setCount(value);
 };
 const decrease = (value) => {
   decreaseAction();
   setCount(value);
 };

Я даже не джун и реактом по нормальному  меньше месяца занимаюсь, так что прошу не бить за плохой код

и из изначального состояние убери
const [count, setCount] = useState(0);

типа так

Я же писал про юзэффект...

Не могу его юзать в данной ситуации, так как потом в value будут координаты привязке по сетке которые будут меняться по движению мыши

А по клику нужно будет в count эти координаты положить

а отдельный стейт для этого не подойдет?

и странно, что стейт изначальный зависит от пропсов