前言：第一次寫的時候，思路。
1：獲取權限>繪製canvas>保存canvas返回路徑,canvasToTempFilePath>圖片暫存downloadFile>保存圖片saveImageToPhotosAlbum
但是在開發小程序開發工具中在圖片暫存出現問題，因爲開發工具內downloadFile正常，到了手機微信報錯，因爲只能下載http文件，二手機返回的是“wxfile://***”暫存路徑，另就是canvas繪製的網絡圖片不顯示，本地圖片正常，所以繞了一下，先緩存網絡圖片。所以有了以下船新版本。
2：獲取權限>圖片暫存downloadFile>繪製canvas>保存canvas返回路徑,canvasToTempFilePath>保存圖片saveImageToPhotosAlbum
1：寫入canvas
<canvas style="width: 100%;height: 1050upx;opacity: 0;" canvas-id="myCanvas"/>
</canvas>
<view class="Saveshare"><view class="save" @click="csss">保存收款碼</view></view>
2：獲取保存圖片權限，一般寫頁面加載完成，看個人需求
wx.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {
console.log('授權成功');
}
});
}
}
});
3：微信分享圖片如果有網絡圖片，需暫存本地，以後再佈置canvas。否則canvas圖片真機測試不顯示（本文圖片有http圖片，也有本地圖片）。
csss() {
let that = this;
wx.downloadFile({
url: that.list.paymentCodeUrl,//此爲http圖片，需先暫存本地，地址爲“wxfile://***”
success: function(res) { }
})
}
4：繪製canvas
const ctx = uni.createCanvasContext('myCanvas');
ctx.rect(0, 0, 750, 80);
ctx.setFillStyle('#FFFFFF');
ctx.fill();
let list = that.list.merchantName;
let arr = list.split('');
let name = '';
let name1 = '';
ctx.font = '28px bold 黑體';
// 設置顏色
ctx.fillStyle = '#000';
// 設置水平對齊方式
ctx.textAlign = 'center';
// 設置垂直對齊方式
ctx.textBaseline = 'middle';
// 繪製文字（參數：要寫的字，x座標，y座標）//文字需居中換行所以只能遍歷折行
if (arr.length < 12) {
ctx.fillText(list, 200, 30);
} else {
for (let i = 0; i <= arr.length; i++) {
if (i <= 11) {
name += arr[i];
}
}
ctx.fillText(name, 200, 30);
let arrs = arr.splice(12, 1);
ctx.fillText(arrs, 200, 60);
}
ctx.beginPath();
ctx.rect(0, 80, 750, 500);
ctx.setFillStyle('#ff8b3d');
ctx.fill();
ctx.font = '30px bold 黑體';
ctx.fillStyle = '#fff';
// 設置垂直對齊方式
ctx.textBaseline = 'middle';
// 繪製文字（參數：要寫的字，x座標，y座標）
ctx.fillText('付款碼', 200, 130);
ctx.drawImage(res.tempFilePath, 65, 155, 250, 250);//網絡圖片已存本地
ctx.drawImage('../../../static/img/hspics/752597618265658563.png', 70, 450, 50, 50);
ctx.font = '18px bold 黑體';
ctx.fillStyle = '#fff';
// 設置垂直對齊方式
ctx.textBaseline = 'middle';
// 繪製文字（參數：要寫的字，x座標，y座標）
ctx.fillText('樂花生 掃碼付款', 200, 480);
ctx.draw();
5：保存canvas，保存canvas爲異步，需延時，否者繪製慢的情況下會沒有圖片
setTimeout(function() {
let that = this;
uni.canvasToTempFilePath({
x: 0,
y: 0,
width: 750,
height: 750,
destWidth: 750,
destHeight: 1050,
canvasId: 'myCanvas',
success: function(res) {
}
});
}, 2000);
6：保存圖片
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function(data) {
wx.showToast({
title: '保存成功',
icon: 'success',
duration: 2000
});
},
fail: function(err) {
if (err.errMsg === 'saveImageToPhotosAlbum:fail auth deny') {
console.log('當初用戶拒絕，再次發起授權');
wx.openSetting({
success(settingdata) {
console.log(settingdata);
if (settingdata.authSetting['scope.writePhotosAlbum']) {
console.log('獲取權限成功，給出再次點擊圖片保存到相冊的提示。');
} else {
console.log('獲取權限失敗，給出不給權限就無法正常使用的提示');
}
}
});
}
},
complete(res) {
}
});
至此結束，完整代碼。uniapp的自己改wx. 覺得可以記得星星。