TwicPics / components

A Web component library that brings the power of TwicPics to your favorite web framework.
MIT License
53 stars 2 forks source link

[feature request] Load callback, or passing a ref to the image? #21

Closed PeterDekkers closed 1 year ago

PeterDekkers commented 2 years ago

Currently, the only way to test if an image is loaded seem to be by looking at the CSS classes of the rendered components. In a React environment it would be nice to take advantage of the virtual DOM and e.g. pass a ref or load/error/progress callback functions to the image component.

My use case is a slide show, where I only want to advance to the next (responsive) image once it is loaded. I would like to avoid circumventing React and using document.querySelector.

Strift commented 2 years ago

Hello @PeterDekkers,

Good idea. Thanks for opening an issue. We have some team members on holiday right now, but we'll take a look at it asap (next week).

Cheers,

jaubourg commented 2 years ago

We need to properly design a means to check and/or react to the image being loading, loaded or in error. We'll probably need to use an observer that watches the img classname for this internally.

Strift commented 1 year ago

Hey @PeterDekkers (or anyone reading this issue!)

We've implemented an API to listen to loading state changes. Check out the lifecycle documentation (this link is for React, but it works with Vue, Svelte, Angular, and their respective meta-frameworks.)

Cheers,