vue-async-modal
Flexible modal component for Vue with ability of asynchronous lazy loading.
Usage
Firstly, you should add Modal
component in your template.
Then, you will be able to get the modal instance via this.$modal
in every Vue component.
We provide a basic modal component ModalItem
.
If you want to open modal MyModal
in component Demo
:
API
There are several useful methods on modal instance:
- open a modal instance
id
is optional, if no id
passed in, it will generate a id by timestamp.
component
could be a normal Vue component or a promise which will resolve a Vue component,
so that we could use code spit and dynamic loading here.
options: {show, backdrop, destroy}
:
show
and backdrop
will true if you don't set it.
If show
is true, when you open modal, it will show automatically, or it will just add into DOM without displaying.
If backdrop
is true, modal will open with a transparent black backdrop, unless backdrop
is static
,
when user click modal outside, modal will auto trigger close
event.
If destroy
is true, the modal instance will destroy automatically on closing.
- close or destroy a modal instance
If id
is falsy, it will be automatically choose current modal instance id.
if destroy
is true, the modal instance will be destroyed even if it's options.destroy
is false.