uniapp上传图片组件,uniapp页面生成图片
相关学习推荐：javascript（视频）
:H5地址http://uni _ upload。gek 6。com/uploader/#/
使用前先new 一下
{code:0， msg :上传成功，数据： http://www。测试。com/uploads/2019 02 27/f 2824d 4d c38 f 30699 f 816226 b4a 578。jpg }复制代码
所有方法均返回 promise 对象 可使用then() 写后续业务 或 使用 async await
/*
2019-02-27
小巷
封装单一应用程序图片上传功能
使用前先新的一下
所有方法均返回承诺对象可使用然后()写后续业务或使用异步等待
服务端返回示例
{ 代码:0,消息:上传成功，数据： http://www。测试。com/uploads/2019 02 27/f 2824d 4d c38 f 30699 f 816226 b4a 578。 jpg
}
选择选择图片
参数数字为要选择的图片数量
上传_一个上传一张图片
参数小路选择成功后返回的缓存文件图片路径
上传上传多张图片
参数path_arr选择图片成功后返回的图片路径数组
选择并上传选择图片并上传
参数数字为要选择的图片数量
*/
//引入配置信息或者自己创建个配置对象
//从导入配置./config。js’；让配置={
//上传图片的应用程序接口
upload _ img _ URL: http://uni _ upload。gek 6。com/index。PHP/index/upload }
类上传器{构造函数(){
}
选择(数字){退回新承诺((解决，拒绝)={
uni.chooseImage({
计数：数量，
成功(资源){
//控制台。日志(分辨率)；
//缓存文件路径
resolve(res.tempFilePaths)
},
失败（错误){
console.log(错误)
拒绝（错误)
}
})
})
}
上传_一个(路径){返回新承诺((解决，拒绝)={
uni.showLoading({
标题：上传中
})
uni.uploadFile({
url: config.upload_img_url，//仅为示例，非真实的接口地址
文件路径：路径，
名称："文件",
成功：(uploadFileRes)={ if( string ===uploadFileRes的类型。数据){
解决(JSON。parse(uploadfileres。数据).数据)
}否则{
resolve(uploadfileres。数据。数据)
}
}，complete() {
uni.hideLoading()
}
});
})
}
上传(path _ arr){ let num=path _ arr。长度；return new Promise(async (resolve，reject)={ let img _ URLs=[]for(let I=0；i numI){ let img _ URL=等一下这个。upload _ one(path _ arr[I])；
console.log(img_url)
img_urls.push(img_url)
};
console.log(全部上传成功)
解析(img _ urls)
})
}
choose _ and _ upload(num){ return new Promise(async(resolve，reject)={ let path _ arr=await this。选择(num)；让img _ URLs=等等。上传(path _ arr)；
resolve(img _ URLs)；
})
}
}导出默认上传者；复制代码
预览一下
参数数字为要选择的图片数量
返回图片缓存路径数组复制代码
体验一下
参数小路选择成功后返回远程图片路径复制代码
服务端返回示例
参数path_arr选择图片成功后返回远程图片路径数组复制代码
直接上源码
参数数字为要选择的图片数量返回图片缓存路径数组复制代码了解更多其他精品文章，敬请关注单一应用程序栏目~
以上就是基于单一应用程序实现图片上传射流研究…插件的详细内容，更多请关注我们其它相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。