欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

微信小程序----真机预览黑屏解决方法

程序员文章站 2024-03-16 21:29:22
...

微信小程序可以在开发工具里正常运行,想用真机预览时发现手机无法加载页面,下面是我的解决方法,只要加上一段代码即可。

在app.js中添加以下代码

function testUpdate(){
  ctx.clearRect(0, 0, window.canvas.width, window.canvas.height)

}

原理是实现一个双缓冲的作用,将画布中的展现在用户面前,再加载画布中的功能,具体原理感兴趣的可以看一下。

官网上有具体的实现方法:http://caibaojian.com/w3c/html5/canvas_clearrect.html

完整实例

var c=document.getElementById("myCanvas");//获取画布id
var ctx=c.getContext("2d");//获取内容
ctx.fillStyle="red";
ctx.fillRect(0,0,300,150);//长宽为300、150的矩形
ctx.clearRect(20,20,100,50);//擦除长宽为100、50的矩形