Vue 延迟加载横幅

Question

我在页面上有 5 个横幅，根据用户的点击选择显示或隐藏。

此时横幅数据来自 API，我正在为 API 上的每个横幅条目迭代横幅组件，知道如何仅在用户单击后下载图像吗？ 我尝试过延迟加载本机行为，但图像在开始时加载，因为它们全部出现在第一次滚动时，我通过用户单击显示或隐藏图像。

<banner-base
    v-for="banner in entry.banners"
    :key="banner.id"
    :slug-ficha="slugSelected"
    :promo-selected="promoSelected"
    :banner-id="banner.id"
/>

Answer 1

您可以在 img 元素上使用 v-show 指令，它仅在单击横幅时显示。