vue项目中使用vant组件ImagePreview图片预览在iOS上存在的问题
存在问题在多个组件内使用,iOS下,切换路由后,会导致ImagePreview组件无法进行图片预览,放大图片<img v-for="(item, index) in imgList"@click="imgPreview(imgList, index)":key="index":src="item"alt/>// 组件内import { ImagePreview } from "vant
·
存在问题
在多个组件内使用,iOS下,切换路由后,会导致ImagePreview组件无法进行图片预览,放大图片
<img v-for="(item, index) in imgList"
@click="imgPreview(imgList, index)"
:key="index"
:src="item"
alt
/>
// 组件内
import { ImagePreview } from "vant";
methods: {
imgPreview(imgs, index) {
ImagePreview({
images: imgs,
loseable: true,
startPosition: index,
closeOnPopstate: true
});
}
}
解决方法
在组件销毁时/路由切换时,关闭ImagePreview组件
methods: {
imgPreview(imgs, index) {
this.imgPre = ImagePreview({
images: imgs,
loseable: true,
startPosition: index,
closeOnPopstate: true
});
}
},
beforeDestory() {
this.imgPre.close();
},
//在路由离开的时候,关闭预览的图片
beforeRouteLeave(to, from, next) {
this.imgPre.close();
next();
}
更多推荐
已为社区贡献1条内容
所有评论(0)