Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not working when dynamically changing src on already mounted image #29

Open
darkylmnx opened this issue Sep 11, 2018 · 3 comments
Open

Comments

@darkylmnx
Copy link

It doesn't seem to work when dynamically changing the image (in case of a caroussel for example).

I've checked your code and it seems you are not watching the src prop change. Your computed property has the src as dependency but nothing seems to reset the intersected data which make the next loading not work properly (I mean withou any lazy load or anything).

@callumflack
Copy link

Confirmed, I see this too.

@jgimness
Copy link

Here's a fix, add a watcher and re-observe the disconnected observer

watch: {
    src(newSrc, oldSrc) {
        if ("IntersectionObserver" in window) {
            this.intersected = false
            this.observer.observe(this.$el)
        }
    }
},

One last problem is that there will be a momentary flicker back to the placeholder image. For my app, I need to keep the current image and just replace it with the new image (once loaded), so I will be adding a bit more code.

@alexjoverm
Copy link
Owner

It's true that case is not handled yet in the lib... Would you like to open PR?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants