I’ve created a component that I can use as a pseudo-dialog using ion-popover. It seems to work great, but I’m running into a weird problem where data binding with v-model is just completely broken when I use components inside it.
I put together a minimal repro case in this repository:
This project contains just two vue files besides the blank ionic template:
- ClickerButton (a button that keeps track of how many times you’ve clicked it)
- BaseDialog (my aforementioned dialog component)
When I use ClickerButton on the home screen, it works perfectly.
However, when I open my dialog and try to click the button inside, it registers one click only (which is reflected on the data visible on the home screen) – and then no more until I close the dialog and re-open it. Additionally, the component itself doesn’t update to reflect the changes to its model.
Here’s a gif that demonstrates the problem:
All I can imagine is that the popover itself is interfering with my events somehow? I’m honestly totally lost with regard to how to debug this.