新版Convas2D组件在真机中不绘制？
这是在index.js中的部分代码，点击按钮后调用了ClockProcessing函数。模拟器中各个机型都可以，基础库也换过几个，都可以运行。但是在真机中运行调试和预览时都不显示Convas的内容。其他内容正常，无报错。微信开发者工具也回退了版本到Stable 1.06.2209190，还是不行。请问各位这是什么原因？ ClockProcessing: function () {
var DrawingDegree = ((this.data.RemainedTime / this.data.SettedTime) * 2 * Math.PI).toFixed(2);
wx.createSelectorQuery()
.select('#Progress')
.fields({
node: true,
size: true
})
.exec((res) => {
const canvas = res[0].node
const ctx = canvas.getContext('2d')
const width = res[0].width
const height = res[0].height
//console.log(width);
//console.log(height);
// 初始化画布大小
const WindowInfo = wx.getWindowInfo()
const dpr = WindowInfo.pixelRatio
canvas.width = width * dpr
canvas.height = height * dpr
ctx.scale(dpr, dpr)
ctx.translate(width / 2, height / 2); //重置原点坐标
ctx.rotate(1.5 * Math.PI); //重置笛卡尔坐标角度
//我真傻，真的。我单知道变换坐标系就可以方便的使用坐标运算。但不知道x和y倒转了。
//此时，向上为X正方向，向右为Y正方向
/////////////////// 灰色背景圆
ctx.beginPath();
ctx.translate(ctx.width, ctx.height);
ctx.arc(0, 0, width / 2 - 10, 0, Math.PI * 2);
ctx.lineWidth = 10;
var Gradient_Grey = ctx.createLinearGradient(0, 10, width / 2, height);
Gradient_Grey.addColorStop("0", "#f0f0f0");
Gradient_Grey.addColorStop("1.0", "#f1f1f1");
ctx.strokeStyle = Gradient_Grey;
ctx.stroke();
ctx.closePath();
////////////////////灰色背景圆
////////////////////动态圆
ctx.beginPath();
ctx.arc(0, 0, width / 2 - 10, 0, DrawingDegree);
ctx.lineWidth = 10;
var Gradient_Green = ctx.createLinearGradient(0, 10, width / 2, height);
Gradient_Green.addColorStop("0", "#a3da33");
Gradient_Green.addColorStop("1.0", "#56B37F");
ctx.strokeStyle = Gradient_Green;
ctx.stroke();
ctx.closePath();
ctx.beginPath();
ctx.arc(width / 2 - 10, 0, 5, 0, Math.PI * 2);
ctx.fillStyle = Gradient_Green;
ctx.fill();
ctx.closePath();
////////////////////动态圆
/////////////////小纽扣
ctx.beginPath();
let Position_x = Math.round(Math.sin(DrawingDegree) * (width / 2 - 10));
let Position_y = Math.round(Math.cos(DrawingDegree) * (width / 2 - 10));
//console.log("X:" + Position_x);
//console.log("Y:" + Position_y);
//console.log(DrawingDegree);
ctx.arc(Position_y, Position_x, 12, 0, Math.PI * 2);
ctx.fillStyle = "#ffffff";
ctx.shadowOffsetX = 0;
ctx.shadowOffsetY = 0;
ctx.shadowColor = 'rgba(86,179,127,0.5)';
ctx.shadowBlur = 10;
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.arc(Position_y, Position_x, 6, 0, Math.PI * 2);
ctx.fillStyle = "#56B37F";
ctx.shadowOffsetX = 0;
ctx.shadowOffsetY = 0;
ctx.shadowColor = 'rgba(86,179,127,0.5)';
ctx.shadowBlur = 14;
ctx.fill();
ctx.closePath();
/////////////////小纽扣
////////////
//ctx.save();
ctx.rotate(Math.PI / 2);
ctx.font = '52px 微软雅黑';
ctx.fillStyle = '#000'
ctx.fillText(this.data.TimeStr, -ctx.measureText(this.data.TimeStr).width * 0.5, 10);
ctx.font = '12px 微软雅黑';
ctx.fillStyle = '#808A87';
ctx.fillText("剩余时间", -ctx.measureText("剩余时间").width * 0.5, 36);
////////////
/*
ctx.beginPath();
ctx.fillStyle = 'rgb(200, 0, 0,0.5)';
ctx.fillRect(0, 0, 251, -16);
ctx.closePath();
*/
})
},
同时贴一下电脑和手机的截图： [图片] [图片]
