canvas2D模式当中,createImage返回的实例,onload不触发问题怎么规避?
微信小程序Canvas的canvas2D模式的Canvas示例,调用createImage方法返回的Image实例
此实例onload方法需要被调用,表示图片加载完毕才能继续向下进行,但是同一次小程序运行中,
onload的回调,在第一次执行此流程的时候会被成功回调,第二次执行此流程的时候就不会被成功回调了。
怎么解决?官方?怎么解决。
调用不了。
我之前看个帖子让我用wx.getImageInfo去获取图片变成临时路径再给canvas
但是不好用,因为我获取的是相对路径,getImageInfo那个(垃圾)接口直接报500
肯定不是我图片路径地址的问题,你说我这么写写法不对拿不到,好,我换成'/src/assets/img/share_image_bg_plain.png'仍旧不行
根本就写不下去了啊,怎么办,求救。
import ShareBackgroundImage from '../../assets/img/share_image_bg_plain.png';
let canvas = Taro.createOffscreenCanvas({
type: '2d',
height: height * zoom,
width: width * zoom,
});
const ctx = canvas.getContext('2d');
ctx.scale(zoom, zoom);
console.log('canvas', canvas);
// 背景图
let backgroundImage = canvas.createImage();
// console.log('backgroundImage',backgroundImage);
await new Promise(resolve => {
console.log('backgroundImage',backgroundImage);
console.log('backgroundImageSrc',backgroundImage.src);//console.log的时候永远为'',就是啥都不输出
console.log('backlground Complete',backgroundImage.complete);//console.log的时候永远为false
backgroundImage.onload = resolve//真机测试第一次onload会触发,第二次onload不会触发
backgroundImage.src = ShareBackgroundImage // 要加载的图片 url
})
ctx.drawImage(backgroundImage, 0, 0, width, height);