uniapp点击按钮保存图片

您可以在uniapp中通过编写以下代码来实现点击按钮保存图片的功能：

首先，在按钮元素中添加点击事件：
<button class="info" @click="capture()">点击保存我哦~</button>

然后，在相应的Vue组件中编写capture函数，用于实现保存图片的逻辑：
capture() {
var pages = getCurrentPages(); //获取当前页面信息
var page = pages[pages.length - 1];
var bitmap = null;
var currentWebview = page.$getAppWebview();
bitmap = new plus.nativeObj.Bitmap('amway_img');
// 将webview内容绘制到Bitmap对象中
currentWebview.draw(bitmap, function() {
let rand = Math.floor(Math.random() * 10000);
let saveUrl = '_doc/' + rand + 'a.jpg';
bitmap.save(saveUrl, {}, function(i) {
uni.saveImageToPhotosAlbum({
filePath: i.target,
success: function() {
uni.showToast({
title: '保存图片成功',
mask: false,
duration: 1500
});
}
});
}, function(e) {
console.log('保存图片失败：' + JSON.stringify(e));
});
}, function(e) {
console.log('截屏绘制图片失败：' + JSON.stringify(e));
});
}
这段代码首先获取当前页面信息，然后创建一个Bitmap对象，并将当前页面的内容绘制到Bitmap对象中。接下来，设置保存图片的路径，并调用bitmap.save()方法将图片保存到指定路径。最后，调用uni.saveImageToPhotosAlbum()方法将图片保存到相册中，并给出保存成功的提示。

通过以上代码，您可以实现uniapp中点击按钮保存图片的功能。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [uniapp点击按钮 保存页面为图片到本地](https://blog.csdn.net/weixin_47284756/article/details/115351367)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *3* [source-vue-master.zip](https://download.csdn.net/download/m0_72731342/87356971)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]