Lightgallery v2 多实例

Question

这个库has an example根据元素ID构建一个图库：

lightGallery(document.getElementById('lightgallery'), {
    plugins: [lgZoom, lgThumbnail],
    speed: 500,
    ... other settings
});

我想基于一个类构建几个实例。我试图迭代一个集合：

import lightGallery from 'lightgallery';

let galleries = document.getElementsByClassName('lightbox');

for (const gal of galleries) {
  lightGallery(gal), {
    selector: 'a',
  }
}

但它不起作用。我收到了这个错误（尽管 HTML 元素有一个 a 元素，里面有 img）：lightGallery :- data-src is not provided on slide item 1. Please make sure the selector property is properly configured.

如何从 HTML 集合构建这些画廊？

Answer 1

只是在途中创建 ID：

let galerias = document.getElementsByClassName('lightbox');

for (let i = 0; i < galerias.length; i++) {

  galerias[i].id = 'gal' + i; // <-------------------- creating IDs here

  lightGallery(document.getElementById('gal' + i), {
    selector: 'a',
  });

}