feat(widgets): lazy load images in FormDropdown (#5904)

some users may have a very large number of files, so we only need to
request/render the ones that are visible.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5904-feat-widgets-lazy-load-images-in-FormDropdown-2816d73d36508195b283ff469061f3f3)
by [Unito](https://www.unito.io)

Co-authored-by: Claude <noreply@anthropic.com>
This commit is contained in:
Rizumu Ayaka
2025-10-04 04:03:36 +08:00
committed by GitHub
parent 5cff131144
commit 661885f5e5

View File

@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, inject, ref } from 'vue'
import LazyImage from '@/components/common/LazyImage.vue'
import { cn } from '@/utils/tailwindUtil'
import { AssetKindKey, type LayoutMode } from './types'
@@ -102,10 +103,11 @@ function handleVideoLoad(event: Event) {
muted
@loadeddata="handleVideoLoad"
/>
<img
<LazyImage
v-else-if="mediaSrc"
:src="mediaSrc"
class="size-full object-cover"
:alt="name"
image-class="size-full object-cover"
@load="handleImageLoad"
/>
<div