js-vue-swipe图片放大—踩坑
2021-03-29 19:28
阅读:630
安装
npm install vue-image-swipe -D
引用
import Vue from ‘vue‘ import VueImageSwipe from ‘vue-image-swipe‘ import ‘vue-image-swipe/dist/vue-image-swipe.css‘ Vue.use(VueImageSwipe)
使用
hello worldli :key="index" @click="preview(index)" v-for="(l, index) in images">
上面是官方给的文档例子,可是关于this.$imagePreview中的images官方的解释为:图片的url数组
可是却没有说明一个坑:当传递到的images图片的url链接没有在页面进行加载的时候(没有使用img标签引用),那么第一次调用$imagePreview会导致图片无法显示
解决方案:
将 images数组的url数组进入页面的时候,使用img标签提前进行预加载,加上css display:none不显示即可
评论
亲,登录后才可以留言!