diff --git a/README.md b/README.md
index 3b3475cc..95df5ce8 100644
--- a/README.md
+++ b/README.md
@@ -155,6 +155,12 @@ And include the `` component it in your project:
```
+Alternatively, the modals container can be automatically appended to the document body once the plugin is loaded using `injectModalsContainer: true`:
+
+```js
+Vue.use(VModal, { dynamic: true, injectModalsContainer: true })
+```
+
Call it (the first argument is the component definition, the second are component properties, the third modal parameters, and the fourth the modal event listeners):
```javascript
diff --git a/src/Modal.vue b/src/Modal.vue
index 12fa2af3..5c0d7399 100644
--- a/src/Modal.vue
+++ b/src/Modal.vue
@@ -346,7 +346,7 @@ export default {
/**
* Returns class list for click outside overlay (background click)
*/
- backgroundClickClass() {
+ backgroundClickClass () {
return ['v--modal-background-click']
},
/**
diff --git a/src/ModalsContainer.vue b/src/ModalsContainer.vue
index 1559f1b7..ae29a736 100644
--- a/src/ModalsContainer.vue
+++ b/src/ModalsContainer.vue
@@ -29,9 +29,9 @@ export default {
methods: {
add (modal, params, config, events) {
let id = this.uid++
- config = config ? Object.assign({}, config) : {};
+ config = config ? Object.assign({}, config) : {}
if (!config.name) {
- config.name = '_dynamic-modal-' + id;
+ config.name = '_dynamic-modal-' + id
}
this.modals.push({
id: id,
diff --git a/src/index.js b/src/index.js
index 643c616f..ca260cab 100644
--- a/src/index.js
+++ b/src/index.js
@@ -57,7 +57,13 @@ const Plugin = {
* Registration of component
*/
if (options.dynamic) {
- Vue.component('modals-container', ModalsContainer)
+ if (options.injectModalsContainer) {
+ const modalsContainer = document.createElement('div')
+ document.body.appendChild(modalsContainer)
+ new Vue({ render: h => h(ModalsContainer) }).$mount(modalsContainer)
+ } else {
+ Vue.component('modals-container', ModalsContainer)
+ }
}
}
}