I can't click on the image to preview it,I have tried many ways, this is my last resort

[cirbinus]

• Using Vue from CDN
• Using Flask

index.html:

<div class="lightgallery" id="lightgallery" v-html="mediaElements">
        </div>

script.js:

function createMediaElement(media) {
      let element;
      if (media.type === 'image') {
        element = `
          <a class="gallery-item" data-src="${media.src}">
            <img class="img-responsive" src="${media.thumbnail}" alt="${media.alt}">
          </a>
        `;
      } else if (media.type === 'video') {
        element = `
          <a class="gallery-item" data-video="${media.video}" data-poster="${media.thumbnail}">
            <img class="img-responsive" src="${media.thumbnail}" alt="${media.alt}">
          </a>
        `;
      }
      return element;
    }

const response = await fetch('/api/media-list'); 
        const data = await response.json();

        mediaList.value = data;

        let elements = '';
        mediaList.value.forEach(media => {
          elements += createMediaElement(media);
        });
        mediaElements.value = elements;


watch(mediaElements, (newVal) => {
      if (newVal !== '') {
        lightGallery(document.getElementById("lightgallery"), {
          plugins: [lgZoom, lgThumbnail],
          speed: 500,
        });
        console.log(newVal);
        console.log("lightGallery loaded");
      }
    });

console output：

script.js:54 RefImpl {dep: Dep, __v_isRef: true, __v_isShallow: false, _rawValue: '\n          <a class="gallery-item" data-src="./sta…e-a256-5465d70aaa42.jpg">\n          </a>\n        ', _value: '\n          <a class="gallery-item" data-src="./sta…e-a256-5465d70aaa42.jpg">\n          </a>\n        '}
script.js:56 RefImpl {dep: Dep, __v_isRef: true, __v_isShallow: false, _rawValue: Array(4), _value: Proxy(Array)}
lightgallery.min.js:8 [] 'dynamicElements'
lightgallery.min.js:8  lightGallery: 0000-0000-000-0000 license key is not valid for production use
w.validateLicense @ lightgallery.min.js:8
w @ lightgallery.min.js:8
(匿名) @ lightgallery.min.js:8
(匿名) @ script.js:216
callWithErrorHandling @ vue.global.js:2407
callWithAsyncErrorHandling @ vue.global.js:2414
baseWatchOptions.call @ vue.global.js:8276
job @ vue.global.js:2137
callWithErrorHandling @ vue.global.js:2407
flushJobs @ vue.global.js:2612
Promise.then
queueFlush @ vue.global.js:2526
queueJob @ vue.global.js:2521
effect.scheduler @ vue.global.js:7552
trigger @ vue.global.js:617
endBatch @ vue.global.js:675
notify @ vue.global.js:948
trigger @ vue.global.js:922
set value @ vue.global.js:1792
fetchPhotosMetadata @ script.js:45
await in fetchPhotosMetadata
(匿名) @ vue.global.js:4964
callWithErrorHandling @ vue.global.js:2407
callWithAsyncErrorHandling @ vue.global.js:2414
hook.__weh.hook.__weh @ vue.global.js:4944
flushPostFlushCbs @ vue.global.js:2589
render @ vue.global.js:8097
mount @ vue.global.js:6083
app.mount @ vue.global.js:12149
(匿名) @ script.js:253
script.js:220 
          <a class="gallery-item" data-src="./static/medias\6bfad756-dd9a-4473-9d90-62052ef04d11.jpg">
            <img class="img-responsive" src="./static/thumbnails\thumbnail_6bfad756-dd9a-4473-9d90-62052ef04d11.jpg.jpg" alt="6bfad756-dd9a-4473-9d90-62052ef04d11.jpg">
          </a>
        
          <a class="gallery-item" data-src="./static/medias\cc50ddc5-ed0c-46df-b344-ac8209bb3347.jpg">
            <img class="img-responsive" src="./static/thumbnails\thumbnail_cc50ddc5-ed0c-46df-b344-ac8209bb3347.jpg.jpg" alt="cc50ddc5-ed0c-46df-b344-ac8209bb3347.jpg">
          </a>
        
          <a class="gallery-item" data-src="./static/medias\40737f40-90cf-48ec-b1ae-89d6bf4da276.jpg">
            <img class="img-responsive" src="./static/thumbnails\thumbnail_40737f40-90cf-48ec-b1ae-89d6bf4da276.jpg.jpg" alt="40737f40-90cf-48ec-b1ae-89d6bf4da276.jpg">
          </a>
        
          <a class="gallery-item" data-src="./static/medias/cf74fe82-9042-41fe-a256-5465d70aaa42.jpg">
            <img class="img-responsive" src="./static/thumbnails/thumbnail_cf74fe82-9042-41fe-a256-5465d70aaa42.jpg.jpg" alt="cf74fe82-9042-41fe-a256-5465d70aaa42.jpg">
          </a>
        
script.js:221 lightGallery loaded