- 当前 Bug 的表现（可附上截图）
Component中canvas的draw回调函数无法进入， 只打印了1
- 预期表现
回调函数会进入,并打印1 和 2
- 复现路径
见Demo
- 提供一个最简复现 Demo
const context = wx.createCanvasContext('xx_canvas');
context.setFillStyle('red')
context.fillRect(10, 10, 150, 100)
console.log("1");
context.draw(false, function(e) {
console.log("2");
// do something...
wx.canvasToTempFilePath({
x: 0,
y: 0,
width: 650,
height: 960,
canvasId: 'xx_canvas',
fileType: 'png',
success: function (res) {
let pic = res.tempFilePath;
console.log(pic);
wx.previewImage({
urls: [res.tempFilePath],
})
}
});
})
只打印了“1”，未打印2.
Draw回调加延时换成setTimeout就好了,代码如下
const context = wx.createCanvasContext('xx_canvas');context.setFillStyle('red')context.fillRect(10, 10, 150, 100)console.log("1");context.draw(false, setTimeout(function(e) {console.log("2");// do something...wx.canvasToTempFilePath({x: 0,y: 0,width: 650,height: 960,canvasId:'xx_canvas',fileType:'png',success:function(res) {let pic = res.tempFilePath;console.log(pic);wx.previewImage({urls: [res.tempFilePath],})}});},300))谢谢，可以了。
draw的callback函数外面包一层等待canvas渲染的时间，不同设备有部分差异，200毫秒基本都能满足
const context = wx.createCanvasContext('xx_canvas', this)
wx.canvasToTempFilePath 也要加上第二个参数 this
模拟器中调试加了this还是无法进入哈。
wx.canvasToTempFilePath 第二个参数加上this也无法进入，报"canvasToTempFilePath: fail canvas is empty" 错误。
你好，请问你的问题怎么解决的，我也遇到这个问题了
再读一遍API~
https://developers.weixin.qq.com/miniprogram/dev/api/wx.createCanvasContext.html
需要加第二个参数加this? 加了还是不行。
不好意思，看了文档也没看明白，第二个参数到底该传什么，是this吗
组件里使用要传this，如果canvas的宽高是动态设置的，还要setTimeout才行
嗯嗯，问题解决了，上次也是您帮忙解决了问题，非常感谢
不客气~