2
0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-07 07:12:23 +03:00

Update appendToBody.js

Provides an API for #1266
This commit is contained in:
Jeff
2020-12-23 11:20:02 -08:00
parent 2f18243d0a
commit cf11b6f133
+16 -1
View File
@@ -1,4 +1,12 @@
export default {
/**
* called when the bound element has been inserted into its parent node
* (this only guarantees parent node presence, not necessarily in-document).
* @see https://vuejs.org/v2/guide/custom-directive.html#Hook-Functions
* @param el The element the directive is bound to. This can be used to directly manipulate the DOM.
* @param bindings
* @param context
*/
inserted (el, bindings, {context}) {
if (context.appendToBody) {
const {height, top, left, width} = context.$refs.toggle.getBoundingClientRect();
@@ -9,17 +17,24 @@ export default {
left: (scrollX + left) + 'px',
top: (scrollY + top + height) + 'px',
});
context.$emit('dropdown:appending', { el })
document.body.appendChild(el);
}
},
/**
* called only once, when the directive is unbound from the element
* @param el
* @param bindings
* @param context
*/
unbind (el, bindings, {context}) {
if (context.appendToBody) {
if (el.unbindPosition && typeof el.unbindPosition === 'function') {
el.unbindPosition();
}
if (el.parentNode) {
context.$emit('dropdown:removing', { el })
el.parentNode.removeChild(el);
}
}