uniapp表格生成图片

您可以使用uniapp的canvas来生成表格图片。首先，您需要在页面中创建一个canvas元素，并设置其宽度和高度适应表格的大小。然后，使用uniapp的canvas API来绘制表格内容，包括表头和单元格数据。最后，使用canvas的toTempFilePath方法将canvas转换为图片文件。以下是一个示例代码：

<template>
  <view>
    <canvas id="myCanvas" :style="canvasStyle"></canvas>
    <button @click="generateImage">生成图片</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      canvasStyle: 'width: 300px; height: 300px;', // 设置canvas的宽度和高度
    };
  },
  methods: {
    generateImage() {
      // 创建canvas上下文
      const ctx = uni.createCanvasContext('myCanvas', this);

      // 绘制表格
      ctx.setStrokeStyle('#000000');
      ctx.setLineWidth(1);
      
      // 绘制表头
      ctx.strokeRect(0, 0, 100, 20);
      ctx.fillText('表头1', 10, 15);
      ctx.strokeRect(100, 0, 100, 20);
      ctx.fillText('表头2', 110, 15);
      
      // 绘制单元格数据
      ctx.strokeRect(0, 20, 100, 20);
      ctx.fillText('数据1', 10, 35);
      ctx.strokeRect(100, 20, 100, 20);
      ctx.fillText('数据2', 110, 35);

      // 绘制完成后，调用toTempFilePath方法将canvas转换为图片文件
      ctx.draw(false, () => {
        uni.canvasToTempFilePath({
          canvasId: 'myCanvas',
          success: (res) => {
            console.log(res.tempFilePath); // 生成的图片文件路径
          },
        }, this);
      });
    },
  },
};
</script>

您可以根据实际需求调整表格的样式和绘制逻辑。在上述代码中，我只是简单地绘制了一个带有表头和单元格数据的表格，您可以根据需要自定义更复杂的表格样式。