uni-app 上传文件

这篇博客详细介绍了在uni-app中实现图片选择与上传的过程,通过uni.chooseImage和uni.uploadFile进行文件操作。同时,展示了如何封装一个统一的上传文件接口,该接口处理了上传逻辑并支持回调函数,方便在不同场景下使用。
摘要由CSDN通过智能技术生成
<view class="img"  @tap="getUploadImg">
				<image :src='list.logo'></image>
			</view>
getUploadImg(e) {
				uni.chooseImage({
					count: 1, // 默认9
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: (res) => {
						var tempFilePaths = res.tempFilePaths;
						uni.showLoading({
							mask: true
						})
						var params = {
							url: "/p/file/upload",
							filePath: tempFilePaths[0],
							name: 'file',
							callBack: (res2) => {
								uni.hideLoading();
								this.list.logo = JSON.parse(res2).resourcesUrl + JSON.parse(res2)
									.filePath,
									this._photoFiles = JSON.parse(res2).filePath
								this.isChange = true
							},
						};
						http.upload(params);
					},
					fail: (failMsg) => {
						console.log(failMsg)
					}
				})
			},

上传文件统一接口

/**
 * 上传文件统一接口
 */
function upload(params) {
    console.log(params)
    wx.uploadFile({
        url: config.domain + params.url,
        filePath: params.filePath,
        name: params.name,
        header: {
            'Authorization': params.login ? undefined : wx.getStorageSync('token')
        },
        formData: params.formData,
        dataType: 'json',
        responseType: params.responseType == undefined ? 'json' : params.responseType,
        success: function(res) {
			console.log(res,'------------')
            if (res.statusCode == 200) {
                //如果有定义了params.callBack,则调用 params.callBack(res.data)
                if (params.callBack) {
                    params.callBack(res.data);
                }
            } 
        },
        fail: function(err) {
            uni.hideLoading();
        }
    });
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值