uni-app上传图片功能，点击 对应图片 实现删除

<template>
	<view class="" style="padding:  10px;">
		<view class="uploadstyle"  @click="addPicture" v-if='tempFilePathsEditor.length == 0'>
			<image src="../../static/img/unloadPho.png" mode="" style="width: 150upx;height: 150upx;"></image>
			<view class="" style="color: #999;font-size: 35upx;">
				上传人脸认证识别
			</view>
		</view>
		<view class="" style="font-size: 35upx;font-weight: 700;margin-top: 20upx;border-top: 1px solid #f6f6f6;
							box-shadow: 0px 0px 20px rgba(28, 41, 146, 0.1);height: 100%;padding: 30upx 0;"
				v-if="tempFilePathsEditor.length!=0">
			<text style="font-weight: 700;padding: 30upx 0;">我的照片</text>
			<view class="upload-border" style="position: relative;">
				<view class="upload-border" v-for="(item, index) in tempFilePathsEditor" :key="index"
					  style="margin-bottom: 100upx;;position: relative;" v-if="tempFilePathsEditor.length!= 0">
					<image :src=item style="width: 100%;"  mode="widthFix"></image>
				</view>	
				<image :src=imgUrl mode="" style="position: absolute;top:0px;right: 0px;width: 80upx;height: 80upx;z-index: 999;"
						@click.stop="changePho" ></image>
			</view>
		</view>
	</view>
</template>

<script>
	import http from '../../../common/http.js';
	import {mapState} from 'vuex'
	export default {
		computed:{
			...mapState(['facePhotos'])
		},
		data() {
			return {
				tempFilePathsEditor: [],
				newUrl: '',
				showUnload: true,
				imgUrl:'../../static/img/change.png'
			}
		},
		onLoad() {
			console.log('facePhotos:onLoad')
			var checkingItem = uni.getStorageSync('facePhotos');
			console.log(checkingItem)
			this.tempFilePathsEditor.push(checkingItem)
		},
		methods:{
			changePho() {
				var that = this
				uni.showModal({
				  title: '提示',
				  content: '是否删除？',
				  success: res => {
				    if (res.confirm) {
				      that.showUnload = false
					  that.tempFilePathsEditor.length = 0
				      that.tempFilePathsEditor = []
					  that.newUrl = ''
					  // uni.clearStorage();
				    } else if (res.cancel) {
				      }
				    }
				})
			},
			addPicture() {
				var that = this
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['camera','album'], //从相册选择
					success: function(res) {
						// console.log("修改图片" + JSON.stringify(res))
						for (var n = 0; n < res.tempFilePaths.length; n++) {
							// console.log("http.baseUrl + '/api/test/upload'=" + http.baseUrl + '/api/test/upload')
							uni.uploadFile({
								url: http.baseUrl + '/api/test/upload',
								filePath: res.tempFilePaths[n],
								name: 'file',
								formData: {},
								success: function(res) {
									console.log('res=' + JSON.stringify(res))
									if (JSON.parse(res.data).code == 0) { 
										that.tempFilePathsEditor.push(JSON.parse(res.data).data.url)
										console.log('that.tempFilePathsEditor=',that.tempFilePathsEditor)
										try {
											uni.setStorageSync('facePhotos', that.tempFilePathsEditor[0]);
										} catch (e) {
											// error
										}
										// uni.setStorage('facePhotos',JSON.parse(res.data).data.url);
										// console.log(uni.setStorage('facePhotos',JSON.parse(res.data).data.url))
									}
								}
							})
						}
					},
					error: function(e) {
						console.log(e);
					}
				})
			}
		}
	}
</script>

<style>
	.uploadstyle {
		background-color: #f6f6f6;
		text-align: center;
		padding: 160upx 0;
		border-radius: 20upx;
		/* box-shadow: 0px 0px 20px rgba(28, 41, 146, 0.1); */
	}
</style>

实现了上传图片，显示图片，删除图片，并存到本地。
一个小案例，希望能给予帮助。