uniapp：自己手写多图上传的组件，先记录代码，待完善

本文链接：https://blog.csdn.net/qq_40745143/article/details/134059340

在这里插入图片描述

<template>
	<view class="upFileImg">
		<view class="upFile">
			<view class="item" v-for="(item,index) in lists" :key="index" @click="upLoad('edit',item.id)">
				<view class="close" @click.stop="delet(item.id)" v-if="!lock">
					<image src="../../static/img/69.png" mode=""></image>
				</view>
				<image :src="item.src" mode="" class="" class="src"></image>
				<view class="previewFullImage" v-if="previewFullImage" @click.stop="doPreviewImage"></view>
			</view>
			<view class="item" v-if="maxCont > lists.length" @click="upLoad('add')"></view>
		</view>
	</view>
</template>

<script>
	export default {
     
		props: {
     
			// 默认上传多少张
			count: {
     
				type: [Number, String],
				default: 1
			},
			// 最大上传数量
			maxCont: {
     
				type: [Number, String],
				default: 1
			},
			// 回显时 传过来lists
			lists: {
     
				type: [Array],
			},
			// 是否时查看，查看不可修改
			lock:{
     
				type: [Boolean],
				default:false,
			},
			// 是否禁用
			inputDisabled:{
     
				type: [Boolean],
				default:false,
			},
		},
		data() {
     
			return {
     
				curren: 0, // 给图片做个标记，用来修改/删除
				previewFullImage: true, // 预览图片
				uploading: false, // 上传加锁
			}
		},
		onReady() {
     
			console.log(Number.MAX_VALUE);
		},