tips:canvasToTempFilePath生成图片的方法写在draw里面

开始画图

drawCanvas() {
  if(!this.hasimg){
    const ctx = uni.createCanvasContext('myCanvas');
    //背景图片
    var codeurl = this.codeurl
    var bgurl = this.bgurl
    var avaurl = this.avaurl
    var tel=this.tel
    var code="邀请码："+this.info.ReferralCode
	console.log(codeurl)
    //画布背景填色
    ctx.setFillStyle('#ffffff')
    ctx.fillRect(0, 350, 300, 500);
    // ctx.setFillStyle('#5A4ABA')
    // ctx.fillRect(0, 0, 300, 32);
    //图片
    ctx.drawImage(bgurl, 0, 0, 300,370);
    ctx.drawImage(avaurl, 12, 410, 50,50); //头像没有路径
	
    //说明文字
    ctx.setFontSize(12)
    ctx.setFillStyle('#333333')
    ctx.fillText(tel, 80, 420)
    ctx.setFontSize(9)
	ctx.setFillStyle('#5A4ABA')
	this.drawRoundedRect(ctx,"#7364ca","#7364ca",74,435,90,18,9);
    ctx.setFillStyle('#ffffff')
    ctx.fillText(code, 84, 447.5)
	
	ctx.rect(200, 400, 64,64)
	ctx.stroke()
	ctx.drawImage(codeurl, 200, 400, 64,64);
	
	//转为图片卸载draw里面
    ctx.draw(false,function(){
		uni.canvasToTempFilePath({
			canvasId: 'myCanvas',
			x: 0,
			y: 0,
			width: 300-10, //截取canvas的宽度（-10解决图片白边问题）
			height: 500, //截取canvas的高度
			destWidth: 300,    
			destHeight: 500,
			quality:1,
			fileType:'jpg',
			success: function (res){
				this.hasimg=true
				this.saveImgurl=res.tempFilePath;console.log( this.saveImgurl)
			}
		})
	})
  }
},

点击保存画布图片

Wxshare(){
  var _this=this
  uni.saveImageToPhotosAlbum({  //保存图片到相册
    filePath: this.saveImgurl,
    success: function () {
      uni.showToast({
        title: "图片保存成功！",
        duration: 2000
      })
      setTimeout(() => {
        uni.navigateBack({})
      }, 2000);
    }
  })
},
//多次用到的绘图方法封装
roundedRect(ctx,x,y,width,height,radius){
    if(width <= 0 || height <= 0){
        ctx.arc(x,y,radius,0,Math.PI*2);
        return;
    }
    ctx.moveTo(x+radius,y);
    ctx.arcTo(x+width,y,x+width,y+height,radius);
    ctx.arcTo(x+width,y+height,x,y+height,radius);
    ctx.arcTo(x,y+height,x,y,radius);
    ctx.arcTo(x,y,x+radius,y,radius);
},
drawRoundedRect(ctx,strokeStyle,fillStyle,x,y,width,height,radius){
    ctx.beginPath();
    this.roundedRect(ctx,x,y,width,height,radius);
    ctx.strokeStyle = strokeStyle;
    ctx.fillStyle = fillStyle;
    ctx.stroke();
    ctx.fill();
},