微信小程序 长按图片不出现菜单_微信小程序长按保存图片
微信浏览器打开h5页面如果是img标签的话，长按会弹出保存图片的选项。但是微信小程序里面不可以，需要自己写这个功能。
这个功能有两个点，一个是长按，一个是保存图片到本地。
1. 微信小程序关于图片长按的解释，有两种：
因此我们选用 bindlongpress 事件
2. 微信小程序同样提供了保存图片的接口，是wx.saveImageToPhotosAlbum()
3. 值得说的是，保存的接口，两个需要注意的地方：
1、需要先授权，调用 wx.getSetting()方法
2、保存的图片路径参数，不支持网络路径，而在我们渲染页面时，用到的图片有很大可能是网络路径，这时候我们需要先把网络路径转为可用的本地路径，wx.getImageInfo()方法可以满足需要
4. 最后再走个心吧，毕竟我这么可爱
1、长按后直接保存未免潦草了些，考虑到用户体验，加入 wx.showActionSheet()
2、如果用户拒绝授权 或者 以前拒绝过授权，这时候也应该给他提示，或者展示再次打开授权的入口
将将！然后就可以开始写代码了： // 长按保存功能--授权部分
saveImage (e) {
let _this = this
wx.showActionSheet({
itemList: ['保存到相册'],
success(res) {
let url = e.currentTarget.dataset.url;
wx.getSetting({
success: (res) => {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success: () => {
// 同意授权
_this.saveImgInner(url);
},
fail: (res) => {
console.log(res);
wx.showModal({
title: '保存失败',
content: '请开启访问手机相册权限',
success(res) {
wx.openSetting()
}
})
}
})
} else {
// 已经授权了
_this.saveImgInner(url);
}
},
fail: (res) => {
console.log(res);
}
})
},
fail(res) {
console.log(res.errMsg)
}
})
},
// 长按保存功能--保存部分
saveImgInner (url) {
wx.getImageInfo({
src: url,
success: (res) => {
let path = res.path;
wx.saveImageToPhotosAlbum({
filePath: path,
success: (res) => {
console.log(res);
wx.showToast({
title: '已保存到相册',
})
},
fail: (res) => {
console.log(res);
}
})
},
fail: (res) => {
console.log(res);
}
})
},
微信小程序 长按图片不出现菜单_微信小程序长按保存图片相关推荐
- 微信小程序 长按图片不出现菜单_微信更新，新功能上了热搜
微信在推出新功能方面相当克制,但每一次总能引起全网关注. 昨天,微信又因为一个小功能的改进再次上了热搜,在安卓最新的 7.0.17 版本当中,微信取消了两分钟内删除功能. 在新版微信中,发出的消息在两 ...
- 微信小程序 长按图片不出现菜单_微信小程序实现长按删除图片的示例
说明 最近在学小程序,遇到长按图片删除的问题,特此记录,记录自己的成长轨迹 需求: 长按删除指定图片 需要解决的问题 长按事件如何表示出来? 如何获取当前长按元素的下标? 如何删除元素? 解决办法 长 ...
- 微信小程序 长按图片不出现菜单_小程序-长按保存图片
微信浏览器打开h5页面如果是img标签的话,长按会弹出保存图片的选项.但是微信小程序里面不可以.需要自己写这个功能.这个功能有两个点,一个是长按,一个是保存图片到本地. 1,.微信小程序提供了长按的事 ...
- 微信小程序 长按图片不出现菜单_HTML5微信长按图片不会弹出菜单的解决方法
UGUI 学习笔记 1.UGUI中是没有depth的概念,那要怎么在脚本中动态的改变一个UI元素在hierarchy中的排序位置呢? 放到最上面 Transform.SetAsFirstSibling ...
- 视频教程-微信小程序系统教程Java版[3/3阶段]_微信小程序电商系统-微信开发
微信小程序系统教程Java版[3/3阶段]_微信小程序电商系统 微信企业号星级会员.10多年软件从业经历,国家级软件项目负责人,主要从事软件研发.软件企业员工技能培训.已经取得计算机技术与软件资格考试 ...
- 视频教程-微信小程序系统教程python版[3/3阶段]_微信小程序支付-手游开发
微信小程序系统教程python版[3/3阶段]_微信小程序支付 微信企业号星级会员.10多年软件从业经历,国家级软件项目负责人,主要从事软件研发.软件企业员工技能培训.已经取得计算机技术与软件资格考试 ...
- java 程序实现对图片的压缩生成缩略图并可设定长宽、尺寸压缩率、图片质量
转载自 java 程序实现对图片的压缩生成缩略图并可设定长宽.尺寸压缩率.图片质量 之前是在另一位高手的上传内容中学习到的,并将其代码根据我的需求进行了修改,参考位置:http://jiangpin ...
- 微信小程序系统教程Java版[3/3阶段]_微信小程序电商系统-翟东平-专题视频课程...
微信小程序系统教程Java版[3/3阶段]_微信小程序电商系统-2445人已学习 课程介绍 微信小程序系统教程[初级阶段],微信小程序0基础学起,讲解微信小程序开发的基础知识. 微信小 ...
- 微信小程序图片转换成文字_微信小程序中用canvas将文字转成图片，文字自动换行...
onReady: function () { wx.showLoading({ title: '生成图片中...', }) var that = this const ctx = wx.createC ...
最新文章
- angular初步认识一
- Openstack组建部署 — Environment of Controller Node
- java登录失败重新登录_为什么我的一直都是进入登录失败界面
- CleanMyMac教程轻松解决各种使用难题
- Android CheckBox
- 大数据分析需注意哪些问题
- Gstreamer入门之Helloworld(一)
- 《MATLAB图像处理375例》——1.3 MATLAB概述
- java 打印日志乱码
- 中国天气数据，中国地面气象站要素清单
- 注意，你需要注意的使用盗版破解软件发论文存在的风险及规避方法
- markdown 在线解析 工具
- Windows操作系统进阶：防火墙基础和Windows Defender
- 伦斯勒理工学院计算机科学专业强吗,伦斯勒理工学院计算机专业申请条件（附案例）...
- Generative Adversarial Nets[AAE]
- 虾扑 erp 神技能分析，shopee 卖家的得意助手
- ImportError:attempted relative import with no known parent package
- 提取Excel中文字链接地址
- 若x,y均定义为int型,z定义为double型,以下不合法的scanf函数调用语句是: A)scanf(“ %d%lx,%le“,x,y,z)； B)scanf(“%2d * %d%lf“,
- Model Inversion Attacks that Exploit Confidence Informati on and Basic Countermeasures 阅读心得