微信小程序canvas绘制图片退出重进后继续上次绘制内容

要实现微信小程序canvas绘制图片退出重进后继续上次绘制内容，可以通过以下步骤实现：

1. 在Page的data中添加一个用来保存每次绘制的内容的数组rows。
2. 在onReady生命周期函数中，先判断是否有保存的绘制内容，如果有，则将之前的绘制内容重新绘制到canvas上。
3. 在drawTable函数中，将绘制的内容保存到rows数组中。
4. 在saveImg函数中，将rows数组保存到本地存储中。
5. 在页面初始化时，通过wx.getStorageSync获取本地存储中的rows数组，并赋值给data中的rows。
6. 在onReady生命周期函数中，判断是否有保存的绘制内容，如果有，则将之前的绘制内容重新绘制到canvas上。

以下是修改后的代码：

const app = getApp()
Page({
  data: {
    disabled: false,
    canvasId: 'myCanvas',
    clickCount: 0,
    maxClickCount: 11,
    tableData:[],
    bh:'',
    mc:'',
    zt:'',
    dw:'',
    date: '',
    arr1:'',
    arr2:'',
    array1:['新鲜', '腐烂','干燥', '潮湿', '包装完好','包装破损'],
    array2:['重金属GB5009.15等','农残GB23200.113等','农残NY/T 761等'],
    index:0,
    sum:0,
    row:[],
    y:140,
    rows: [] // 用于保存绘制的内容
  },

  bindPickerChange1: function (e) {
    const index = e.detail.value;
    let array1 = this.data.array1;
    this.setData({
      index,
      arr1: array1[index]
    });
  },

  bindPickerChange2: function (e) {
    const sum = e.detail.value;
    let array2 = this.data.array2;
    this.setData({
      sum,
      arr2: array2[sum]
    });
  },

  bindDateChange: function(event) {
    this.setData({
      date: event.detail.value
    });
  },

  inputbh(event){
    this.setData({
      bh:event.detail.value
    });
  },

  inputmc(event){
    this.setData({
      mc:event.detail.value
    });
  },

  inputzt(event){
    this.setData({
      zt:event.detail.value
    });
  },

  inputdw(event){
    this.setData({
      dw:event.detail.value
    });
  },

  onReady() {
    const ctx = wx.createCanvasContext('myCanvas');
    this.ctx = ctx;
    this.setData({ rows: []});
    this.drawTable();
  },

  drawTable() {
    const { bh, mc, arr1, dw, date, arr2, zt} = this.data;

    // 清空画布
    this.ctx.fillStyle = '#FFFFFF'
    this.ctx.clearRect(0, 0, 1200, 848);
    this.ctx.fillRect(0, 0, 1200, 848);

    // 设置字体样式
    this.ctx.fillStyle = '#000';
    this.ctx.setTextAlign('center');
    this.ctx.setTextBaseline('middle');

    let y = this.data.y || 100 ;

    this.ctx.font = "bold 30px 黑体";
    this.ctx.fillText('样 品 登 记 表', 640, 90);

    this.ctx.font = "black 15px Times New Roman";
    this.ctx.fillText('GHNJ/TR-26', 160, 110);
    this.ctx.fillText('第     页      共     页', 990, 110);

    const points = [
      { x: 60 , y: 130, width: 90, text: '样品编号' },
      { x: 150, y: 130, width: 70, text: '样品名称' },
      { x: 220, y: 130, width: 55, text: '样品状态' },
      { x: 275, y: 130, width: 90, text: '抽样编号' },
      { x: 365, y: 130, width: 210, text: '被检单位' },
      { x: 575, y: 130, width: 70, text: '收样日期' },
      { x: 645, y: 130, width: 65, text: '样品数量' },
      { x: 710, y: 130, width: 120, text: '检查项目及依据' },
      { x: 830, y: 130, width: 60, text: '送样人' },
      { x: 890, y: 130, width: 60, text: '接样人' },
      { x: 950, y: 130, width: 80, text: '结果返回日期' },
      { x: 1030, y: 130, width: 65, text: '报告编号' },
      { x: 1095, y: 130, width: 65, text: '备注' }
    ];

    for (let i = 0; i < points.length; i++) {
      const point = points[i];
      const text = point.text;
      this.ctx.font = "black 13px 宋体";
      this.ctx.strokeRect(point.x, point.y, point.width, 60);
      this.ctx.fillText(text, point.x + point.width / 2, point.y + 30);
    }

    // 添加新内容到 rows 数组
    const newRow = [
      { x: 60, y, width: 90, text: "G-2023-"+bh },
      { x: 150, y, width: 70, text: mc },
      { x: 220, y, width: 55, text: arr1 },
      { x: 275, y, width: 90, text: '' },
      { x: 365, y, width: 210, text: dw },
      { x: 575, y, width: 70, text: date },
      { x: 645, y, width: 65, text: '3 Kg' },
      { x: 710, y, width: 120, text: arr2 },
      { x: 830, y, width: 60, text: '' },
      { x: 890, y, width: 60, text: zt },
      { x: 950, y, width: 80, text: '' },
      { x: 1030, y, width: 65, text: '' },
      { x: 1095, y, width: 65, text: '' }
    ];

    this.setData({ rows: [...this.data.rows, newRow] });

    // 绘制 rows 数组中的内容
    for (let i = 1; i < this.data.rows.length; i++) {
      const row = this.data.rows[i];
      for (let j = 0; j < row.length; j++) {
        const point = row[j];
        const text = point.text;
        // 只绘制在屏幕内的内容
        this.ctx.font = "black 12px 行书";
        this.ctx.strokeRect(point.x, point.y, point.width, 50);
        this.ctx.fillText(text, point.x + point.width / 2, point.y + 25);
      }
    }

    y += 50;

    this.setData({y});

    this.ctx.draw();

    //限制提交次数
    if (this.data.clickCount < this.data.maxClickCount) {
      this.setData({
        clickCount: this.data.clickCount + 1
      });
    }

    if (this.data.clickCount === this.data.maxClickCount) {
      this.setData({
        disabled: true
      });
      wx.showToast({
        title: '本页已满，请保存数据',
        icon: 'none',
        duration: 2000
      });
    }
  },

  saveImg(){
    wx.canvasToTempFilePath({
      x: 0,
      y: 0,
      width: 1200,
      height: 848,
      canvasId: 'myCanvas',
      success: (res) => {
        // 将临时文件路径保存到手机本地
        wx.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success: () => {
            // 在这里可以处理保存成功的逻辑
            wx.showToast({
              title: '保存成功,请点击下一页',
              icon: 'none',
              duration: 2000
            });
          },
          fail: (err) => {
            // 在这里可以处理保存失败的逻辑
            console.error(err);
          }
        });
      },
      fail: (err) => {
        // 在这里可以处理生成图片失败的逻辑
        console.error(err);
      }
    }, this);
  },

  refreshPage: function () {
    wx.showModal({
      title: '提示',
      content: '请确认是否已保存当前数据',
      success(res) {
        if (res.confirm) {
          wx.reLaunch({
            url: '/pages/jiance/jiance'
          })
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      }
    })
  },

  onLoad: function () {
    const rows = wx.getStorageSync('rows') || [];
    this.setData({ rows });
  },

  onUnload: function () {
    wx.setStorageSync('rows', this.data.rows);
  }
})

通过以上步骤，可以实现在小程序中使用canvas绘制图片，当退出页面再次进入时，可以继续上次绘制的内容。