uni.previewImage打开之后怎么监听关闭
尘落
- 发布：2025-05-21 11:28
- 更新：2025-05-21 13:52
- 阅读：32
4 个回复
尘落 (作者)
// 页面中调用预览图片
previewImages() {
uni.previewImage({
urls: ['https://example.com/image1.jpg', 'https://example.com/image2.jpg'],
current: 0
});
// 标记预览已打开
this.isPreviewOpen = true;
},
// 监听页面显示事件
onShow() {
// 只有当预览被打开后再关闭时才执行操作
if (this.isPreviewOpen) {
this.isPreviewOpen = false;
console.log('图片预览已关闭');
// 执行关闭后的操作
}
}
尘落 (作者)
好像不行
DCloud_UNI_JBB
暂不支持
尘落 (作者)
const isPreviewOpen = ref<boolean>(false);const checkVisibilityInterval = ref<any>(null)
const previewImage = (urlList : any, num : any) => {
// #ifdef H5
window.history.pushState(null, null, document.URL);
// #endif
uni.previewImage({
urls: urlList,
current: num,
indicator: 'default',
loop: true,
});
// #ifdef H5
isPreviewOpen.value = true;
checkVisibilityInterval.value = setInterval(() => {
const style = window.getComputedStyle(document.body) as CSSStyleDeclaration;
if (style.overflow !== 'hidden' && isPreviewOpen.value) {
clearInterval(checkVisibilityInterval.value);
isPreviewOpen.value = false;
console.log('图片预览已关闭');
window.history.back();
// 执行关闭后的操作
}
}, 300);
// #endif
}
2025-05-21 13:49
尘落 (作者)
后面应该考虑h5侧滑关闭弹窗也算个路由不是都这么处理累死人
2025-05-21 13:51
尘落 (作者)
onLoad(async (options : any) => {
// #ifdef H5
window.addEventListener('popstate', () => onBack())
// #endif
})
const onBack = () => {
if (isPreviewOpen.value) {
uni.closePreviewImage();
isPreviewOpen.value = false
}
}
onUnload(() => {
// #ifdef H5
window.removeEventListener('popstate', () => onBack());
// #endif
})