uni-app中使用canvas画

在uni-app中使用canvas画可以通过uni.createCanvasContext()方法来创建一个canvas上下文对象，然后通过该对象来进行画布的绘制。

以下是一个简单的例子：

<template>
  <view class="container">
    <canvas canvas-id="myCanvas" style="width: 100%; height: 300rpx;"></canvas>
  </view>
</template>

<script>
export default {
  onReady() {
    // 获取canvas上下文对象
    const ctx = uni.createCanvasContext('myCanvas', this);

    // 设置画笔颜色
    ctx.setStrokeStyle('#ff0000');

    // 开始绘制线条
    ctx.beginPath();

    // 设置线条起点坐标
    ctx.moveTo(10, 10);

    // 绘制线条到另一个坐标点
    ctx.lineTo(150, 50);

    // 设置线条宽度
    ctx.setLineWidth(5);

    // 绘制线条
    ctx.stroke();

    // 关闭路径
    ctx.closePath();

    // 绘制完成，将canvas上下文对象绘制到画布上
    ctx.draw();
  }
}
</script>

在上面的例子中，我们首先在模板中创建了一个canvas元素，并通过`canvas-id`来标识该canvas元素。然后在代码中，我们通过`uni.createCanvasContext()`方法获取到了canvas上下文对象，然后通过该对象进行了绘图操作，最后将画布绘制在canvas元素上。