微信小程序开发中，绘制一个图像，然后再图像上添加文本内容，开发工具中运行效果不显示文本内容。

test.wxml内容如下：

<view class=“classname”>

<canvas canvas-id=“brandCanvas” style=“width:100%”/>

</view>

test.js具体代码如下：

  onReady: function () {

    var phoneInfo = wx.getSystemInfoSync();

    var brand = “hello”;

    var ctx = wx.createCanvasContext(“brandCanvas”);

    var path = “…/…/imgs/dog.png”;

    ctx.drawImage(path, 0, 0, phoneInfo.windowWidth, phoneInfo.windowHeight);

    ctx.draw();

 

    ctx.setFontSize(30);

    ctx.setFillStyle("#ff0000");

    ctx.fillText(brand, phoneInfo.windowWidth*0.3, phoneInfo.windowHeight*0.05);

    ctx.draw(true);

  },

注意代码ctx.draw(true)必须要加参数true

以上运行效果在开发工具中不能看到文本内容，但是在真机测试中是OK的！