Page({
data: {},
onLoad: function () {
const dpr = wx.getSystemInfoSync().pixelRatio;
wx.createSelectorQuery().select('#canvas')
.fields({ node: true, size: true })
.exec(res => {
console.log(res) //exec 的回调函数不能执行
const canvas = res[0].node;
const ctx = canvas.getContext('2d');
canvas.width = res[0].width * dpr;
canvas.height = res[0].height * dpr;
ctx.fillStyle = 'red'
ctx.fillRect(0, 0, canvas.width, canvas.height)
})
}
})
<canvas type="2d" id="canvas" style="width: 100px; height: 100px"></canvas>
这个页面可以在 android, ios, 开发者工具成功预览, 但是通过开发者工具打开 macOS 的微信客户端进行 macOS 的真机预览时, 会显示空白, 因为 exec() 中的回调函数不会执行.
看到 2月的问题, 说 PC 端当时还不支持 canvas 2d, 那么现在还不支持?
https://developers.weixin.qq.com/community/develop/doc/000ac2d1974450c9f6e9aa1be5f400?highline=PC%20%E7%AB%AF%E5%B0%8F%E7%A8%8B%E5%BA%8F%E6%97%A0%E6%B3%95%E6%98%BE%E7%A4%BA%20canvas%202d
微信开发者工具提示不建议使用旧的 canvas 接口, 但是 canvas 2d 诸多 bug 和限制, 用得好难受.
canvas 2d bug太多 , 而且还没人管了
2020年2月份就说不支持，说稍后会支持，这都2022年的1月份了，请问到底啥时候支持？
PC端暂不支持使用canvas 2d, 手机端请使用canvas 2d……
这兼容要怎么做？多写多少代码呀……
这就尴尬了，老板以为是开发的锅😂
尴尬，希望能尽快支持。
现在多了个 PC 端，PC 端又分 windows 和 mac，仿佛回到了 IE 时代，要各种兼容调试。
你好，PC端暂不支持使用canvas 2d。