uniapp图片预览
文章描述：
uniapp点击图片预览效果
html
<view v-for="(item,index) in detailList" :key="index">
<image :src="item" @click="previewImage(index)"></image>
</view>script
export default{
data(){
return{
detailList:[
'https://www.miyil.com/storage/topic/20230515/1.png',
'https://www.miyil.com/storage/topic/20230515/2.png',
'https://www.miyil.com/storage/topic/20230515/3.png'
]
}
},
onShow() {
},
methods:{
//预览轮播图
previewImage:function(index){
var i = this.detailList; //获取当前页面的轮播图数据
console.log(i)
console.log(index)
console.log(i[index])
//uniapp预览轮播图
uni.previewImage({
current:index, //预览图片的下标
urls:i //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
})
}
}
}
发布时间：2023/05/15
发表评论