微信小程序用canvas 绘制虚线

本文主要是介绍微信小程序用canvas 绘制虚线，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

1：效果图

代码：

 <canvas
          style="width: 300px; height: 1rpx;"
          canvas-id="firstCanvas"
          class="line"
        ></canvas>

  // 绘制一条虚线
    drawLine() {
      var context = wx.createCanvasContext('firstCanvas');
      context.setLineDash([8, 15]);
      context.lineWidth = 2;
      context.strokeStyle = '#979797';
      context.beginPath();
      context.moveTo(0, 0);
      context.lineTo(740, 0);
      context.stroke();
      context.draw();
    }

 created() {
   
    this.drawLine();
  }

这篇关于微信小程序用canvas 绘制虚线的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！