vue-preview,一个vue集成PhotoSwipe图片预览插件(移动端)

• Z时代
• 2024-01-10
• 分类：综合

使用步骤：

注意事项：img标签上的class类不能去掉，每个图片数据对象中，必须有 w 和 h 属性

1. 安装 npm i vue-preview -S
2. .在main.js文件中导入该组件，并挂载到Vue身上
   

   import VuePreview from ‘vue-preview’;
   

   Vue.use(VuePreview);
   

   3.在组件中使用
   

   在放缩略图的位置放入模板
   

   <img class=“preview-img” v-for="(item, index) in list" :src=“item.src” height=“100” @click="$preview.open(index, list)">
   

   
   

   4.自己在data中定义一个 list：‘’
   

   5.发送请求获取缩略图
   

以上是 vue-preview,一个vue集成PhotoSwipe图片预览插件(移动端) 的全部内容， 来源链接： utcz.com/z/375107.html