uniapp 上传图片

template


				
				

data

	imageList: [],  //要上传的图片地址
	imglist: []  //页面预览选择的图片

methods

chooseImage: function() {
			uni.chooseImage({
				count: 3,
				success: res => {
					this.imglist = res.tempFilePaths;  //返回的临时地址存进页面上显示的图片数组
					if (res.tempFilePaths.length > 3) {
						uni.showToast({
							title: '最多选择三张图片',
							icon: 'none'
						});
						return false;
					}
					for (var i = 0; i < this.imglist.length; i++) {     //图片上传 多张要循环
						uni.uploadFile({
							url: 'api地址',
							filePath: this.imglist[i], 
							formData: {
								uid: this.uid
							},
							name: 'file',
							success: uploadFileRes => {
								this.imageList.push(uploadFileRes.data);   //上传成功后赋值给表单里要提交的图片地址
								uni.showToast({
									title: '图片上传成功'
								});
							}
						});
					}
				}
			});
		}

表单提交

	formSubmit: function(e) {
			uni.request({
				url: 'api地址',
				method: 'POST',
				header: {
					'Content-type': 'application/x-www-form-urlencoded'
				},
				data: e.detail.value,
				success: res => {
					console.log(res);
					if (res.data == 1) {
						uni.showToast({
							title: '发布成功'
						});
						setTimeout(function() {
							uni.navigateBack({});
						}, 1500);
					}
				},
				fail: () => {},
				complete: () => {}
			});
		}

你可能感兴趣的:(uniapp 上传图片)