微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

【uniapp】多图上传,兼容H5、APP

多图上传

// tempFilePaths:需要上传图片
// uploadUrl:上传地址,(必须传入全地址,例:https://xxxx.com/xxx/xxx/upload;不能使用字符串
// 拼接形式,例:this.$api.baseUrl + '/xxx/xx/upload',否则H5上传不兼容;)
// floder:传入服务器文件名称
//
uploadImgsFn = (tempFilePaths, uploadUrl, floder) => {
	let that = this
	return new Promise((presolve, preject) => {
		if ({}.toString.call(tempFilePaths) != '[object Array]') {
			throw new TypeError(`上传图片参数 tempFilePaths 类型错误!`)
		}
		//路径数组为空时  不上传
		if (tempFilePaths.length == 0) {
			presolve([])
			return
		}
		uni.showLoading({
			title: '上传图片中...',
			mask: true
		});
		let uploads = []
		tempFilePaths.forEach((item, i) => {
			uploads[i] = new Promise((resolve) => {
				uni.uploadFile({
					url: uploadUrl,
					name: 'file',
					filePath: item,
					formData: {
						"folder": floder || "recruitment_img"
					},
					success(res) {
						resolve(JSON.parse(res.data).data)
					},
					fail(err) {
						uni.hideLoading()
					}
				})
				
			})
		})

		Promise.all(uploads).then(res => {
			//图片上传完成
			presolve(res)
			uni.hideLoading()
		}).catch(err => {
			preject(err)
			uni.hideLoading()
			uni.showToast({
				title: '上传失败请重试',
				icon: 'none'
			})
		})
	})
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐