uni-app 点击预览图片

uni-app 点击小图,放大预览

<template>
<view class="main-wrap">
    <view class="img-wrap">
        <image :src="handleClick.imageUrl" @click="TanPreviewImage(handleClick.imageUrl)" mode=""></image>
    </view>
</view>     
</template>

js代码

methods:{
    TanPreviewImage(imageUrl){ 
        console.log(imageUrl) // http://192.168.100.251:8970/6_1597822634094.png
        var images = [];
        images.push(imageUrl);
        console.log(images)  // ["http://192.168.100.251:8970/6_1597822634094.png"]
        uni.previewImage({ // 预览图片  图片路径必须是一个数组 => ["http://192.168.100.251:8970/6_1597822634094.png"]
            current:0,
            urls:images,
            longPressActions: {  //长按保存图片到相册
                itemList: ['保存图片'],
                success: (data)=> {
                    console.log(data);
                    uni.saveImageToPhotosAlbum({ //保存图片到相册
                        filePath: payUrl,
                        success: function () {
                            uni.showToast({icon:'success',title:'保存成功'})
                        },
                        fail: (err) => {
                            uni.showToast({icon:'none',title:'保存失败,请重新尝试'})
                        }
                    });
                },
                fail: (err)=> {
                    console.log(err.errMsg);
                }
        }
        });
    },
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值
>