In some cases we don’t want to use hooks or JSX to invoke an alert (or toast, loading etc). Using plain JS used to work in Ionic 5 but it stays hidden in the new version (including the official starter templates). Is there anything we could do to fix this?
Hey there! I’m not really sure what the use case is here… If hooks are not your thing… there are the overlay components you can use inline
But I guess to better answer your question, Ionic-React changed how components were bundled internally, so this makes sense. I would not recommend manually adding them to the DOM the way you are trying.
I see, thanks. It is useful to be able to invoke an alert (or some other overlay item) in a function outside the React context. That is, without having to pass down the hook function as a dependency. We have some helper functions that are bundled as separate libraries and whilst before we could just invoke the alerts using vanilla JS, now it requires passing down the hook, sometimes multiple functions down to call it.
This used to work fine in Ionic 4/5 and it looks like it is mostly working for alerts in the v6 so I hoped it could be fixed.
Also, the way I view it, we should be able to revert to using plain JS for any Ionic components regardless of which framework is in use.
Very true! I used a helper lib in my project to programmatically call the toast, I just upgraded to v6 and now the toast doesn’t work using the JS format. Now i have to re-write all toast using components.