enableAutoReload for background images

[malkomich]

I am not able to get my images reloaded, enabling the parameter enableAutoReload , while using the data-background-image to provide the image source.

Expected Behavior

The background image should be updated for the observed element.

Current Behavior

The element keeps with the same background image, and the observer is not triggering the update.

Steps to Reproduce (for bugs)

Following are the relevant parts of the component I am working on:
TEMPLATE:

<v-card class="lozad ..." :data-background-image="src" />

SCRIPT:

props: {
  src: {
    type: String,
    required: true,
  },
mounted() {
  this.observer = lozad('.lozad', { enableAutoReload: true })
  this.observer.observe()
},

Context

I am trying to build a gallery for a hybrid application with Nuxt (Vue), in which I have an album selector. When I change that selector, the images should change to the ones stored in the new album selected.

Tested on:

• Browser Name and version: Google Chrome Version 92.0.4515.131 (Official Build) (64-bit)
• Operating System and version (desktop or mobile): Windows 10 Home Version 20H2
• Framework & Version: Vue 2.6.14

[Hemanth-M-K]

any update on this issue? or any solution for this issue?

[jiangts]

Was stumped by this briefly: it's because lozad doesn't reload any elements with the data-loaded=true attribute. If you delete that attribute it will reload the background image.