diff --git a/packages/index.js b/packages/index.js index 7171e7a..ba127de 100644 --- a/packages/index.js +++ b/packages/index.js @@ -42,25 +42,41 @@ const install = function(Vue, opts = {}) { Vue.component(ElImageViewer.name, ElImageViewer); }; +let instance = null; + +const closeImageViewer = function(force) { + if (instance) { + if (force === true) { + document.body.removeChild(instance.$el); + } else { + instance.$el.className = `${instance.$el.className} viewer-fade-leave-active viewer-fade-leave-to`; + setTimeout(function() { + document.body.removeChild(instance.$el); + instance = null; + }, 200); + } + } +}; + const _ImageViewer = function({ index, src, list, ...other }) { + if (instance) { + closeImageViewer(true); + } const ImageViewer = Vue.extend(ElImageViewer); - const instance = new ImageViewer({ el: document.createElement('div') }); + instance = new ImageViewer({ el: document.createElement('div') }); Object.assign(instance, { index: src ? list.findIndex(url => url === src) : index || 0, urlList: list, ...other, - onClose() { - instance.$el.className = `${instance.$el.className} viewer-fade-leave-active viewer-fade-leave-to`; - setTimeout(function() { - document.body.removeChild(instance.$el); - }, 300); - }, + onClose: closeImageViewer, }); document.body.appendChild(instance.$el); }; export const ImageViewer = _ImageViewer; +ImageViewer.close = closeImageViewer; + export default { install, ...components, -- libgit2 0.21.0