Closed vandelpavel closed 1 year ago
Found this issue inside VUE issues: https://github.com/vuejs/core/issues/5203 Could be related
Also this line of code could be the one that skips/breaks the flow if something is inside the template
Hi,
Due to how we are required to architect the Dialog plugin there should be only one root node (and that node should be a QDialog component). The extra comment makes the component have multiple root nodes which breaks the flow completely.
By looking at your code samples, I would recommend just using the delete-me
component directly as the Dialog component.
And should you need to insert any comments, just do them in the children nodes. Just not as root as this changes how Vue compiles your component.
What happened?
I had to wrap a Dialog custom component that uses the quasar Dialog plugin, in order to pass it to the Dialog.create function. My components are:
The main dialog component
The wrapper of the dialog
And then I was opening it like that:
What did you expect to happen?
If you copy that exact code it will work with no problem.
If you add a comment in the wrapper component like so:
the browser console will throw you a runtime error:
[Quasar] Incorrectly defined Dialog component
Reproduction URL
https://codesandbox.io/p/sandbox/romantic-scooby-rwn2l4?file=%2Fsrc%2Fcomponents%2Fdialog_wrapper_component.vue%3A2%2C49
How to reproduce?
Create the 2 components by cooping the code and call the wrapper one
Flavour
Quasar CLI with Webpack (@quasar/cli | @quasar/app-webpack)
Areas
Components (quasar), Plugins (quasar)
Platforms/Browsers
Chrome
Quasar info output
Relevant log output
No response
Additional context
That could be caused by how props are passed through components. It might consider the comment as a tag and for that reason props/events are blocked. Not sure though...