-
Notifications
You must be signed in to change notification settings - Fork 5
feat(vue3): migrate to vue3 #884
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
53cadea to
2a77b56
Compare
|
@susnux I worked a bit on the migration, but I could use help with the Typescript stuff. |
2a77b56 to
eb35f30
Compare
I will have a look - for the moment I rebased it and fixed some minor issues. |
c8bfcb3 to
5de88d4
Compare
|
Hi @susnux! |
Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com> Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
Signed-off-by: Raimund Schlüßler <raimund.schluessler@mailbox.org> Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
|
Pushed an update:
|
|
@raimund-schluessler I'll take over the PR to prepare the release soon, if it's ok |
|
Great, please go ahead! |
st3iny
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems to work otherwise.
| h(dialog, { | ||
| props, | ||
| on: { | ||
| close: (...rest: unknown[]) => { | ||
| onClose(...rest.map(v => toRaw(v))) | ||
| vue.$destroy() | ||
| }, | ||
| onClose: (...rest: unknown[]) => { | ||
| onClose(...rest.map(v => toRaw(v))) | ||
| vue.unmount() | ||
| }, | ||
| }), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
AFAIK, this won't work in Vue 3. We can only pass propsData as the second argument. We need to find another workaround to listen to the close event or simply remove the onClose() handler.
We also need to mount the component explicitly here.
My proposed solution:
const vue = createApp(dialog, props)
vue.mount(el)There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The latest version isn't pushed yet, waiting for the nextcloud-vue release.
Also, it (ideally) relies on spawnDialog from nextcloud-vue.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can only pass
propsDataas the second argument
This is true for createApp().mount(), not for h
Problem here is that props should be destructured.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We need to find another workaround to listen to the close event or simply remove the
onClose()handler.
In Vue 3 event handlers always passed as onEven param.
<comp @event="handler" /> is h(comp, { onEvent: handler })
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
TIL. I wasn't aware of the advanced features of h.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
for dialogs library this createApp is fine, but for nextcloud-vue it can cause unwanted behavior:
- it does not allow globally registered components in the dialog
- it does not allow to access registered pinia
Use case would be e.g. a settings store for dialog you spawn with API.
No description provided.