如何在引导Vue卡中使用<b-img-lazy>

Question

<b-card overlay
  :title="name"
  :sub-title="subtitle"
  :img-src="cardImg"
  img-top
  style="max-width: 20rem;"
  class="mb-2 insider-image"
  ref="card">
</b-card>

我目前正在将一张巨大的图像文件渲染到卡的背景上。我该如何使用b-img-lazy内卡

Answer 1

使用新的b-card-img-lazy子组件。您仍然需要手动将子组件放置在<b-card no-body>内，并放置构建cafrd所需的所有其他子组件（即<b-card-body>等）。

请参阅b-card文档页面的“厨房水槽”示例。它显示了放置常规<b-card-img>子组件，可以将其更改为<b-card-img-lazy>子组件。