uniapp 图片预览

一、图片预览

此有两个知识点：array.map( )方法 和 uni.previewImage()

HTML部分

<view class="rightPic" v-for="(item,index) in picsList" :key='index'>
	<!-- 给图片一个框 -->
	<image class="img" @click="previewImg(item.img_url)" :src="item.img_url"></image>
	<view class="img-text">{{item.title}}</view>
</view>

JS部分

previewImg (current) {
	//array.map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。 
	const urls = this.picsList.map(item=>{ 
		return item.img_url
	})
	//使图片可打开和滑动
	uni.previewImage({
		// 当前打开的图片
		current,
		// 预览图片链接
		urls
		})
}