使用uniapp进行多张图片上传

<uni-section title="上传图片" type="line" padding subTitle="最多三张哦!">
		<uni-file-picker :limit="3" fileMediatype="image" multiple @select="uploadImage"
		v-model="commodity.imageUrl" :value="commodity.imageUrl"></uni-file-picker>
</uni-section>

多张图片进行上传时进行了  forEach 循环来进行 使用 uni.uploadFile 这个API来进行图片上传

const commodity = reactive({
		imageUrl: []
	})
const uploadImage = (e) => {
		e.tempFilePaths.forEach(filePath => {
			uni.uploadFile({
				url: `https://xxx/xxx/xxx`,  // 这里替换成真实的上传接口
				filePath: filePath,          // 这里是拿到的每一张本地图片
				name: 'imageFile',           // 这里是 与 后端 协商好的名字
				formData: {},                // 这里可以携带一些表单数据
				header: {                    // 设置请求头参数
					'token': uni.getStorageSync('token'),
					'tenantId': uni.getStorageSync('nowTenantId') || '',
					"Content-Type": "multipart/form-data",
				},
				success: (res) => {
                    // 这里是因为在编辑时你删除了之前的图片 如果不进行这样的在提交时就会格式错误最后页面的图片就会显示不出来。
                    // 如果不需要修改就直接给你的响应式数据 不需要下面的操作
					let result = JSON.parse(res.data);
					const urls = result.data.split(',');
					urls.forEach(url => {
						commodity.imageUrl.push({
							url: url.trim()
						});
					});
				},
				fail: (error) => {
					console.log('上传失败', error);
				}
			});
		});
	}