Hello, I have 2 components:
- a page with a button
- a popup component
I was able to open popup from the page, but after i close popup from backdrop popup closes, but to re-open it need to click 2 time on the button.
See video: Registrazione schermo 2021-10-07 alle 08.58.07.mov - Google Drive
Where’s the error?
popup code
page code
Seems like you pass wrong onPopupClosed={!toggle}
handler, what is !toggle
how is it NOT FUNCTION?
from the parent i pass:
- open state (true or false)
- toggle (to close popup from popup’s inside button)
I tried also with this but not working
<Popup opened={open} onPopupClosed={!open}>
onPopupClosed accepts function
See pls my code, i get very confused.
What i should change?
Well it is JavaScript basics, in your first example you should pass function, so it probably should be onPopupClosed={toggle}
One more question:
why if i do something like this, backdrop of popup isn’t visible?
{popup && <ItemPopup
open={true}
data={data}
toggle={togglePopup}/> }
I mean i don’t want to display the popup while state is not true
But doing this, my popup appears without backdrop.
{popup && <ItemPopup
open={true}
data={data}
toggle={togglePopup}/> }
This is my code
How to fix it?
Video is not helpful. Do I see the code in the video? Do I see what you pass and to what components? Do I see components code?
Posting it for the 3rd time:
Live example would be helpful How to ask a good question on forum
Please take a look into the code: https://z8zvi.csb.app/
Thanks a lot
I can clearly see the backdrop in your link, but I see you still have mess with that toggle functionality, here is the correct example f7-popup-bugs (forked) - CodeSandbox