需求:制作类似三里商学院小程序的【复制文案】、【一键保存】功能。
目的:使用户更便捷地提取想要的信息。
使用【一键复制】
思路:把需要的文字复制到手机剪贴板,使用小程序API wx.setClipboardData 方法。
- wxml文件:
<!-- 一键复制 -->
<view class='co_copy' bindtap='bindcopy' data-description='{{item.description}}'>一键复制</view>
data-description='{{item.description}}' 表示需要的复制文字。
- js文件:
bindcopy: function(e) {
var description = e.currentTarget.dataset.description;
wx.setClipboardData({
data: description,
success: function(res) {
wx.getClipboardData({
success: function(res) {
console.log(res.data)
}
})
}
})
},
使用【一键保存】
思路:把需要的图片下载到本地 wx.downloadFile ,再在成功回调函数中使用 wx.saveImageToPhotosAlbum 方法,把照片保存到手机。
- wxml文件:
<!-- 一键保存 -->
<view class='co_save' bindtap='bindsave' data-thumbs='{{item.thumbs}}'>一键保存</view>
data-thumbs='{{item.thumbs}}' 表示需要的保存图片。
- js文件
bindsave: function(e) {
var thumbs = e.currentTarget.dataset.thumbs;
//console.log(thumbs)
for (var i = 0; i < thumbs.length; i++) {
var thumb = "https://zdu.igdlrj.com/attachment/" + thumbs[i];
//console.log(thumb)
wx.showLoading({
title: '保存中...',
mask: true
});
wx.downloadFile({
url: thumb,
success: function(res) {
if (res.statusCode == 200) {
let img = res.tempFilePath;
wx.saveImageToPhotosAlbum({
filePath: img,
success: function(res) {
wx.showToast({
title: '保存成功',
icon: 'success',
duration: 2000
});
},
fail(res) {
wx.showToast({
title: '保存失败',
icon: 'success',
duration: 2000
})
}
})
}
}
})
}
},
欢迎关注我的博客: https://blog.csdn.net/weixin_42323607
github地址: https://github.com/Nurtuam
多多支持!本人会持续更新哒 ❤️