uniapp实现小程序图片预览、音频播放、视频播放

1. 实现图片预览主要代码：

<ul v-if="index == 0" class="collapse-sty">
						<li v-for="img in imageList">
							<u-image width="200rpx" height="200rpx" @click="previewImage(img)" :src="getBaseUrl() + img.url"></u-image>
						</li>
					</ul>

previewImage(val) {
				if (val) {
					let imageURL = this.getBaseUrl() + val.url
					uni.previewImage({
						current: imageURL, // 当前显示图片的 http 链接
						urls: [imageURL] // 需要预览的图片 http 链接列表
					});
				}
			},

效果图：

2. 实现视频预览主要代码：

<ul v-if="index == 2" class="collapse-sty">
						<li v-for="video in videoList">
							<video :src="getBaseUrl() + video.url" class="my-Video"></video>
						</li>
					</ul>

效果图：

3. 实现音频预览主要代码：

<ul v-if="index == 1" class="collapse-sty">
						<li v-for="audio in radioList" style="width: 100%;">
							<free-audio startPic='/static/images/play.png' endPic='/static/images/stop.png' :url='getBaseUrl() + audio.url'></free-audio>
						</li>
					</ul>


import freeAudio from '@/components/free-audio/free-audio.vue'

components: {
			freeAudio
		},

效果图：