canvas在编辑器可以显示，真机不显示

这是HTML代码

<view class="canvas-wrap">    <view class="top">      <canvas class="cir" style="width:110rpx; height:110rpx; z-index: 1" canvas-id="canvasArc"> </canvas>      <canvas class="cir" style="width:110rpx; height:110rpx; z-index: 2" canvas-id="canvasProcess"></canvas>    </view>

这是js代码

data: {     countState: 0   },

ready: function() {   let cxt_arc = wx.createCanvasContext('canvasArc');     cxt_arc.setLineWidth(6);     cxt_arc.setStrokeStyle('#E8E8E8');     cxt_arc.setLineCap('round')     cxt_arc.beginPath();     cxt_arc.arc(27, 27, 24, 0, 23 * 23 * Math.PI, false);     cxt_arc.stroke();     cxt_arc.draw();     this.countDown();    }

/**    * 组件的方法列表    */ method: {   countDown: function() {       let countDown = setInterval(() =>{         let countNum = this.data.countState;         countNum ++;         this.setData({           countState: countNum                  })         let pathEx = countNum * 0.2 + 1.5;         if(pathEx > 2) {           pathEx = pathEx - 2;         }          if(countNum == 10) {           clearInterval(countDown);         }         let cxt_process = wx.createCanvasContext('canvasProcess');         cxt_process.setLineWidth(6);         cxt_process.setStrokeStyle('#F3C62A');         cxt_process.setLineCap('round')         cxt_process.beginPath();         cxt_process.arc(27, 27, 24, 1.5 * Math.PI, pathEx * Math.PI, false);         cxt_process.stroke();         cxt_process.draw();       }, 1000)     } }

在编译器上是正常运行的，但是在真机上是不显示的