This content originally appeared on DEV Community and was authored by Mykolas Mankevicius
TL;DR;
Here's the link to the gist use/change/modify it.
Have you ever wanted a simple dialog, which is completely custom, but you didn't want to pull in a package.
But it always looks like a mess to make?
Well worry no more! In todays Vue.js snippets post we'll make just that! Don't believe me? Have a look at the finished result!
And this is the API for it:
If you like it here's the explanation on how to write one yourself.
The useDialog.js
The basic premise is, we want a nice api to use dialogs right?
Something that has an expresive api with autocompletion if possible. Something like:
Dialog.myCustomType()
.title('hello')
.onConfirm(() => { //do something })
This is a bit of a whopper of a class, but it's easy to write test for. I've written the basic api. You can change/modify this to your liking.
Thing to improve?
- Allow multiple onConfirm/onCancel callbacks
Quite simple just change the
onConfirmCallbacktoonConfirmCallbacks = []And then on each call ofonConfirm, just push the callback into the stack, andonResolveawait all of the callbacks
This content originally appeared on DEV Community and was authored by Mykolas Mankevicius
Mykolas Mankevicius | Sciencx (2021-06-11T05:27:47+00:00) useDialog – Vue.js snippets. Retrieved from https://www.scien.cx/2021/06/11/usedialog-vue-js-snippets/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.