不确定如何在vue项目中使用灯箱吗？

Question

嗨，大家好！'我目前正在尝试在我的项目中使用灯箱！正如您注意到的那样，我在项目数组中使用了（v-for），但我有一个问题：如何将灯箱与v-for项目集成在一起？我真的不知道如何相互融合，非常感谢您的帮助。

vue-image-lightbox Vuejs的简单图片灯箱组件 https://www.npmjs.com/package/vue-image-lightbox

<div class="items" v-scroll-reveal.reset>
   <md-card 
      v-for="(product,index) in products"
      :key="index"
      v-show="product.type === activeProduct">

      <md-card-media md-ratio="16:9">
        <img :src="require(`../assets/img/products/${product.img}`)"/>
      </md-card-media>

   </md-card>
</div>

Answer 1

将img替换为<LightBox :images="images"></LightBox>。根据npm页面中的examples，images变量是一个具有多种分辨率的对象。

元素应在之后自动呈现。