如何銷毀和重新初始化 lightgallery.js

Question

我在我的頁面上使用 lightgallery，效果很好。 我已經向畫廊添加了過濾器 function，所以現在需要銷毀並重建我的光畫廊以反映畫廊內容的變化。 到目前為止我有這個：

源碼.js

import 'lightgallery.js';


var gallery = document.getElementById('gallerywrapper');

  if(gallery) {
    lightGallery(gallery, {
      download: false,
      counter: false,
      selector: '.item.active'
    });
  }

  var galleryFilterButtons = document.querySelectorAll('.gallery-filter-button');

  for(var i = 0; i<galleryFilterButtons.length; i++) {
    galleryFilterButtons[i].addEventListener("click", function(){
      // destroy and rebuild here...
    });
  }

我根本無法讓銷毀 function 工作，有人可以指點一下嗎？

Answer 1

該文檔顯示您可以使用以下方法進行銷毀：

 window.lgData[gallery.getAttribute('lg-uid')].destroy(true);

然后再次初始化。 因此，在您的情況下，它將是：

for (var i = 0; i < galleryFilterButtons.length; i++) {
    galleryFilterButtons[i].addEventListener("click", function(){
        window.lgData[gallery.getAttribute('lg-uid')].destroy(true);
        lightGallery(gallery); 
    });
}

您可以在此處查看用例。