在使用uniapp写项目时可能会使用到图片预览,unaipp官网就内置了这个方法。
uni.previewImage官网链接
使用current传入链接或索引值和urls传入需要预览的图片列表即可实现。
// HTML部分
<view class="container flex flex-wrap">
<image
v-for="(item, index) in image"
:key="index"
class="image"
:src="item"
lazy-load="true"
@click="previewImg(item)"
/>
</view>
// 使用uni.previewImage方法
methods: {
// 预览图片
previewImg(e) {
uni.previewImage({
current: e,
urls: this.image
});
}
}