12 uni上传图片及预览

<template>
    <view class="content">
        <button @click="upImg">上传图片</button>
        <view>
            <image v-for="(item,index) in imgArr" 
                   :src="item" :key="index" @click="previewImg(item)"></image>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                imgArr: [], //图片数组
            }
        },
        methods: {
            //上传图片
            upImg() {
                uni.chooseImage({
                    count: 4,  //限制图片上传数量，在小程序中可以起作用
                    success: res => {
                        console.log("shangchuan", res);
                        this.imgArr = res.tempFilePaths;
                    }
                })
            },
            //点击当前图片，进行预览
            previewImg(current) {
                uni.previewImage({
                    current, //当前点击的图片路径
                    urls: this.imgArr,//可以预览的图片数组
　　　　　　　　　　　　loop:true, //是否可以循环播放，这里只在app中有效，小程序中无效
                    success: res => {
                        console.log(res);
                    }
                })
            },
        }
    }
</script>