Image Mapper callbacks unable to access updated state - only access initialized state values
Steps to reproduce
Steps:
- Code Sandbox: https://codesandbox.io/p/sandbox/nice-swanson-89lm88?file=%2Fsrc%2FApp.tsx%3A66%2C16
- Click on Floor area in Image Map
- State updates (check by clicking button), but the alert which access the same state variable "region" does not update in the ImageMapper call back and continues to stay "Initial State".
I have also found another similar error reported by a user here: https://stackoverflow.com/questions/72079850/trouble-setting-state-with-onclick-function-only-with-imagemapper-component-rea
For some reason your Image Mapper callbacks only accesses the initial state value even after the state value has been updated.
Current behavior
For some reason your Image Mapper callbacks only accesses the initial state value even after the state value has been updated.
Expected behavior
Image Mapper callbacks should access the current state values.
Context
No response
Error stack
No response
Live example link
https://codesandbox.io/p/sandbox/nice-swanson-89lm88?file=%2Fsrc%2FApp.tsx%3A66%2C16
Your environment
Desktop
- OS: Mac
- Browser: Firefox + Chrome
I didn't understand the question but I looked into the code and I found that the button does not have a callback so I resolved that issue after that I checked the code and functionality, and whenever I clicked on the floor, it updated the value.
change <button onClick={alert(region)}>Default Button</button> to <button onClick={() => alert(region)}>Default Button</button>
Here is the updated Codesandbox: https://codesandbox.io/p/sandbox/autumn-feather-gcmytw?file=%2Fsrc%2FApp.tsx%3A69%2C30
Since there’s been no response from the OP for the past two months, I’m closing this issue due to lack of discussion from the OP side.