uniapp开发微信小程序怎么把当前页面转为 图片 并且保存到相册
时间: 2023-08-04 22:09:22 浏览: 3539
uniapp 生成海报图片base64转换
5星 · 资源好评率100%
在uniapp开发微信小程序中,我们可以使用uni-app提供的`canvas`组件来把当前页面转为图片并保存到相册。
具体实现步骤如下:
1. 在页面中引入`canvas`组件,并设置它的id和宽高
```
<canvas canvas-id="myCanvas" style="width: 100%; height: 100%;"></canvas>
```
2. 在页面中定义一个方法,用于将当前页面转为图片并保存到相册
```
methods: {
saveCanvas() {
uni.canvasToTempFilePath({
canvasId: 'myCanvas',
success: function (res) {
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function () {
uni.showToast({
title: '保存成功',
icon: 'success',
duration: 2000
})
},
fail: function (err) {
console.log(err)
}
})
}
})
}
}
```
3. 在页面中添加一个按钮,并绑定保存图片的方法
```
<view @tap="saveCanvas">保存图片</view>
```
这样,当用户点击保存图片按钮时,就会调用`saveCanvas`方法,将当前页面转为图片并保存到相册中。需要注意的是,保存到相册需要用户授权,所以在使用`uni.saveImageToPhotosAlbum`方法时,需要进行错误处理。
阅读全文