can't perform a react state updated on an unmounted component #69
Comments
aboveyunhai
changed the title
|
I put your code into a snack and am unable to reproduce the warning: https://snack.expo.io/@steffeydev/6f4b71 Can you please create a snack or a full working example that shows the warning? I will note that this is not a bug, just a small potential memory leak that probably has no impact. Of course, if I can reproduce it I will fix it nonetheless. |
|
After 2 hours debugging with expo and mixing up with all possible combination I can come up from my test app. It seems like the problem does not exist. Just some information about my emulator;
My phone is samsunng S9, Android Version is 10 |
|
I'm facing the same behavior. The first time I run the application when I close the popover I receive the same warning message. |
|
Alright, I'm plugging it into my ejected app now so hopefully can reproduce and fix. |
|
@SteffeyDev, if it serves of any help, this is the stack trace that the warning returns to me:
|
|
@SteffeyDev, my best guess is that this is being caused by the call to https://github.com/SteffeyDev/react-native-popover-view/blob/master/src/Popover.tsx#L495 Since |
|
Yep, I found that as well and fixed in 3.0.2. Let me know if it works for you as well! |
|
Sorry for the late reply. Unfortunately, the issue is still there - I've tested version 3.0.3. Apparently, when I dismiss the popover, |
|
@rafaelsaback Can you pass |
I just check the new version in both brand new |
|
Hey @SteffeyDev, I ran it once again to generate the debug logs, but funnily enough, I didn't face the issue any longer. I even tried different phones, but the warning was no longer displayed. Thanks for fixing this and feel free to close the issue. 👍 |
|
Glad to hear! |
There is a warning message only when opening and closing for the first time {
"react": "17.0.2",
"react-native": "0.66.4",
"react-native-popover-view": "^5.0.1",
}Codeimport React, { useRef, useState } from 'react'
import { Text, TouchableOpacity } from 'react-native'
const BasicPopover: React.FC = () => {
const touchable = useRef<TouchableOpacity>(null)
const [showPopover, setShowPopover] = useState(false)
return <>
<TouchableOpacity
ref={touchable}
onPress={() => {
setShowPopover(true)
}}>
<Text>target</Text>
</TouchableOpacity>
<RNPopoverView
debug
from={touchable}
isVisible={showPopover}
onRequestClose={() => {
setShowPopover(false)
}}>
<Text>content</Text>
</RNPopoverView>
</>
}Log |
|
I see this issue is closed @SteffeyDev, however this is definitely still happening for me, in 5.0.0 (RN 0.67.3 on iOS 15.4), when closing the popover. The source of the issue reported by React Native is calling My conclusion is that the issue is because I added some debugging to the relevant parts of the code to trace the execution of dismissing the popover: In the log you can see that Something that worked for me was to use the callback argument of onCloseComplete={() => {
this.setState({ showing: false }, () => {
if (onCloseComplete) onCloseComplete();
});
}}Which makes sense because once the state has been updated to |
|
Thanks for the research, I'll look into this again next time I'm working this project. |
|
@SteffeyDev just opened a PR to solve this issue. |
|
Thank you @jonathanj for the deep dive and solution. |
|
@mazenchami's PR included in 5.0.2. Going to close for now, will re-open if you still encounter the issue on 5.0.2 |
@SteffeyDev I was trying to create a list of items along with tooltips,
While closing one of the tooltips, I got the warning
can't perform a react state updated on an unmounted component.It seems like the problem has nothing to do with my list example, the problem always appears in
react native bare flowwhen popover is closed.The text was updated successfully, but these errors were encountered: