Events

The component exposes two events: success and error. Pretty straightforward; the first one is triggered when an image is safely loaded and rendered, and the latter will be triggered when the browser fails to load the image. To deal with errors, make sure to check the fallback image chapter.

<script setup>
const onSuccess = () => {
  // done!
}

const onError = () => {
  // ops!
}
</script>

<template>
  <ProgressiveImage
    @success="onSuccess"
    @error="onError"
    src="https://picsum.photos/id/1080/1980/1080"
  />
</template>gtnk