github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-01-24 16:07:59 -05:00
Code Issues Packages Projects Releases Wiki Activity

Fix v-image's intersection observer sometimes preventing image load (#15082)

Browse Source 
* Fix v-image's intersection observer

* check the last entry instead

* clean up

Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>
This commit is contained in:
Azri Kahar
2022-08-17 23:44:18 +08:00
committed by GitHub
parent f8ea4fdcd2
commit d6bfef40cc
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/src/components/v-image.vue
View File

@@ -25,15 +25,17 @@ const srcData = ref<string>(emptyPixel);
let loaded = false;
const observer = new IntersectionObserver(async (entries) => {
const observer = new IntersectionObserver((entries) => {
if (entries.length === 0) return;
inView.value = entries[0].isIntersecting;
if (entries[0].isIntersecting && !loaded && props.src) {
const isIntersecting = entries.at(-1)!.isIntersecting;
inView.value = isIntersecting;
if (isIntersecting && !loaded && props.src) {
loadImage();
}
});
watch(
() => props.src,
() => {