uniapp保存图片_Uniapp实现保存图片到相册(封装起来)
我封装了一个方法,之后可以直接使用
在此之前,先用class封装一个Toast提示框
class Toast{
constructor(title,icon="success",duration=1300,mask=true) {
this.title = title
this.icon = icon
this.duration = duration
this.mask = mask
}
// 消息提示框:自动消失
showtoast(){
uni.showToast({
title: this.title,
icon:this.icon,
duration: this.duration,
mask:this.mask
});
}
// 消息提示框,手动消失
showloading(){
uni.showLoading({
title: this.title,
mask:true
});
}
// 轻提示
}
export default Toast
然后就开始封装我们的downloadImg.js了
import toast from './toast.js'
export default function downloadImg(url){
uni.showLoading({
title: '正在下载',
mask: true
})
console.log(url)
let that = this;
uni.getImageInfo({
src: url,
success(res) {
console.log(res.path)
uni.saveImageToPhotosAlbum({
filePath: res.path,
success(res) {
new toast("已保存至相册").showtoast()
},
fail(err) {
console.log(err);
uni.hideLoading();
uni.showModal({
title: '保存图片至相册',
content: '需要获取您的相册权限,请确认授权',
success: function(res) {
if (res.cancel) {
uni.showToast({
title: '获取相册权限失败',
icon: 'none',
duration: 2000
})
} else if (res.confirm) {
uni.showLoading({
title: '打开设置',
mask: true
})
uni.openSetting({
success: function(data) {
uni.hideLoading();
new toast("请重新点击下载原图").showloading()
}
})
}
}
})
}
})
},
fail(err) {
console.log(err);
new toast("下载失败,请重试").showloading()
}
})
}
然后最好把它挂载到原型上面,这样就能全局使用了
import previewLogic from './public/previewImg.js'
Vue.prototype.$previewLogic = previewLogic
之后项目中如何使用呢?
previewImg(index,imgArray){
new this.$previewLogic(index, imgArray).previewImg()
}
index就是图片的下标
imgArray是包含图片的数组。例如:[‘图片1’,‘图片2’…]
previewImg,index,imgArray是自定义的,不是标准
uniapp保存图片_Uniapp实现保存图片到相册(封装起来)相关推荐
- uniapp保存图片_uni-app项目保存图片到相册
插件预览图 功能介绍 1.长按保存图片 2.右下角图片点击保存图片 3.点击图片可以隐藏图片 使用教程 1.插件代码拷贝 下载后把components目录下saveFile.vue文件拷贝到自己项目目 ...
- c语言保存图片image,iOS 保存图片到【自定义相册】
3.1.Photos 框架基本认识,我们可以在 Help->Developer Documentation-> 选择OC或者Swift 搜索 Photos Photos 框架检索 Phot ...
- uniapp框架如何实现仿微信相册插件 | 图视频编辑 + 压缩
在上上篇文章中(),我们基于uniapp框架实现了仿微信相册中的拍照+录像功能.今天,就继续在uni-app中实现: 1: 图片编辑 2: 视频编辑 3: 文件压缩 技术实现 开发环境:Hbuilde ...
- uniapp下载视频文件到手机相册
uniapp下载视频文件到手机相册 uni.downloadFile 下载文件,uni.saveFile保存文件,uni.openDocument打开文件,下载的是图片时可以自动保存,但下载视频只能播 ...
- uniapp 微信小程序保存图片到系统相册(包括获取手机相册权限)即拿即用
目录 1. 代码,即拿即用 2. 介绍使用到的方法 1. uni.getSetting 2. uni.authorize 3. uni.saveImageToPhotosAlbum 4. uni.op ...
- 微信小程序保存图片到相册;uni-app小程序保存网络图片到相册;小程序保存图片到相册拒绝授权后重新拉起授权;保存图片到系统相册;小程序保存图片测试可以,真机保存图片失败
文末代码可以直接复制使用,图片修改成你的图片路径即可 一.场景: 小程序点击按钮,保存项目内的静态图片或者微信头像或者后端返回的图片: 二.注意点及思路拆分: –2.1:小程序保存图片功能,必须要有s ...
- uniapp保存图片_uni-app处理图片乱码
1.前提概要 向后端发送请求获取图片,得到的响应数据是一堆火星文,如下,找度娘了解一番,这是一堆二进制乱码,主要问题是由于uni.request发请求时,设置的responseType不对或者根本就没 ...
- uniapp 微信小程序保存图片到系统相册( 获取用户是否开启 授权保存图片到相册。)
1.预览效果图 当用户点击拒绝按钮后的截图: 用户点击不授权 则关闭弹窗 单独给用户点击授权后, 跳转到授权页面 开启授权后: 2.代码 <template><view class ...
- iOS 保存图片(视频)到相册
1.C语言函数方式实现 注意:UIImageWriteToSavedPhotosAlbum方法必须实现代理方法,否则会崩溃. //参数1:图片对象 //参数2:成功方法绑定的target //参数3: ...
最新文章
- 常见的“公共标志和说明”英文表达
- raid5数据恢复方法,服务器磁盘阵列数据恢复成功案例
- Windows下Node.js开发入门(1)
- C#Excel文件读取问题及解决办法
- 记得5年前左右的时候,IT这块刚好处于最火专业之一!至今为止,依旧很多人选择计算机!由于女生也很多选择这块,所以给很多公司带来了福利啊!以前一个互联网公司女生少的可怜啊!可随着IT这块人员的进入,竞争
- 通过图注意力神经网络进行多智能体游戏抽象_[读论文] AttnPath: 将图注意力机制融入基于深度强化学习的知识图谱推理中...
- 【转】Postman系列四:Postman接口请求设置环境变量和全局变量、测试沙箱和测试断言、测试集运行与导入数据文件
- 台达plc自由口通讯_台达PLC和ABB机器人Devicenet通讯
- 在RHEL5/CentOS5上配置使用Open×××
- android图片分辨率改变,android 通过修改图片像素实现CircleImageView
- mysql索引表交换分区_MySQL交换分区的实例详解
- 2.1.6 用ProtectX实现扫描的反击与追踪
- 程序员的 10 款代码表白特效,一个比一个浪漫
- 美团下拉菜单html5,jQuery vue仿美团订餐系统分类菜单切换代码
- Matlab图形的线型、标记、颜色
- 数学建模一:层次分析法 附代码详解
- Deus Ex:人类革命 - 图形研究
- ANC主动降噪,FFT方案与FxLMS方案比较
- 在线修改http header
- Kali linux 学习笔记(七十五)拒绝服务——teardrop 2020.4.15
热门文章
- 最常用的决策树算法(二)Random Forest、Adaboost、GBDT 算法
- 搜索推荐炼丹笔记:Transformer在搜索推荐中的应用
- com.android.dex.DexIndexOverflowException: Cannot merge new index 66299 into a non-jumbo instruction
- [译] D3.js 嵌套选择集 (Nested Selection)
- 【张其中】中本聪,我们究竟需要怎样的加密货币?
- oracle rac理论知识
- 30.Node.js 全局对象
- CentOS下Apache环境支持GBK编码解决网页乱码问题
- Memcache mutex设计模式
- iOS五种本地缓存数据方式