Failed to execute 'drawImage' on CanvasRendering?
发布于 5 年前 作者 mawei 3600 次浏览 来自 官方Issues
 	Page({
               data: {
                 shareUrl: ""
               },
               onLoad() {},
               onReady() {
                 const query = wx.createSelectorQuery()
                 query.select('#mycanvas')
                   .fields({
                       id: true,
                       node: true,
                       size: true
                     }).exec(this.init.bind(this));
               },
               init(res) {
                 console.log(res, "res")
                 const canvas = res[0].node
                 const ctx = canvas.getContext('2d')
                 const dpr = wx.getSystemInfoSync().pixelRatio
                 //新接口需显示设置画布宽高;
                 canvas.width = res[0].width * dpr
                 canvas.height = res[0].height * dpr
                 ctx.scale(dpr, dpr);
                 this.setData({
                   canvas,
                   ctx
                 });
                 this.canvasDraw(); //向画布载入图片的方法
               },
               canvasDraw() {
                 let img = this.data.canvas.createImage();
                 img.onload = () => {
                   //img.complete表示图片是否加载完成,结果返回true和false;
                   this.data.ctx.drawImage(img, 00300300);
                 };
                 img.src = '../index/wxmini.jpg'
                 console.log(img.complete);//false
               },
 })

报错:

TypeError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The provided value is not of type ‘(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)’

调试了好几个基础库都是这样的报错,目前是2.17.0,目前的图片是放本地的,不是临时生成的图片路径

2 回复

请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

提供一个能够复现的代码片段?我用你的代码是没有问题的

回到顶部