评论

canvasToTempFilePath: fail canvas is empty 的坑

canvasToTempFilePath 提示 canvasToTempFilePath: fail canvas is empty

wx.canvasToTempFilePath 提示 canvasToTempFilePath: fail canvas is empty,遇到这个问题时搜了好多方案,发现一个都不管用,最后有看了下文档,才发现问题所在。

仔细看下,文档中说当使用canvas 2d时 应该应该使用canvas该属性。

这就是问题所在啊。

当使用2d时根本不用传参 canvasId,直接传入canvas实例即可。

    wx.canvasToTempFilePath({

      x: 0,

      y: 0,

      width: 300,

      height: 200,

      destWidth: 100,

      destHeight: 100,

      canvas:  this.canvas,//这里是重点,获取实例的时候保存为全局变量就行了

      complete(res) {

        console.log(res)

      }

    })


最后一次编辑于  2020-09-06  
点赞 19
收藏
评论

21 个评论

  • 堂吉诃德
    堂吉诃德
    2021-01-05

    小程序真是垃圾


    2021-01-05
    赞同 17
    回复
  • 蚂蚁的地瓜
    蚂蚁的地瓜
    2020-11-06

    canvasPutImageData 这个同样的报错!!!

    2020-11-06
    赞同 8
    回复 4
  • just because
    just because
    2020-10-15

    有效+1,太坑了!!!

    2020-10-15
    赞同 2
    回复
  • 附耳
    附耳
    2022-07-28

    在单独的页面可以 但是在组件里面drow()不执行是怎么回事

    2022-07-28
    赞同 1
    回复
  • 冯富铭
    冯富铭
    2020-12-09

    有效!!!找了一下午!狗东西原来要传canvas实例,其他解决方案都是后面加this

    2020-12-09
    赞同 1
    回复
  • zyw
    zyw
    08-27

    确实有效,

    canvasId: that.canvas.id,

    是ios有效。安卓无效

    08-27
    赞同
    回复
  • 棪燊
    棪燊
    03-07

    还有一种可能是不要在<canvas canvas-id="myCanvas"></canvas>

    里面指定类型

    03-07
    赞同
    回复
  • JERRY
    JERRY
    2023-10-04

    fail fail canvas is empty

    2023-10-04
    赞同
    回复
  • 。
    2023-08-04

    谢谢谢谢,查半天,只有你这个有效

    2023-08-04
    赞同
    回复
  • 涂之包
    涂之包
    2021-03-18
    /**
     * 将 canvas 导出为临时图像文件
     */
    saveToUrl(){
      return new Promise((resolve, reject)=>{
        wx.canvasToTempFilePath({
          canvasthis.canvas, // 画布标识,传入 canvas 组件实例 (canvas type="2d" 时使用该属性)。
          // canvasId 画布标识,传入 canvas 组件的 canvas-id
          // destWidth: this.canvas.width,
          // destHeight: this.canvas.height,
          fileType'png',
          quality'1'// 图片质量
          successfunction (res{
            console.log("store success: ", res);
            upload(res.tempFilePath, 0).then(ress=>{
              console.log("上传成功", ress)
              resolve(ress);
            }).catch(reason=>{
              console.log("upload fail - reason: ", reason);
              reject(reason);
            })
          },
          failfunction (res{
            console.log("store fail: ", res);
            // reject(res)
          },
        })
      })
    };
    
    2021-03-18
    赞同
    回复 3
    • 涂之包
      涂之包
      2021-06-02
      这样写部分机型绘制出来会空白,官方文档中也有写 需要在draw中调用才能保证正常,但还一个关键是draw之后的回调需要加上settimeout。即:在wx.canvasToTempFilePath前加上canvasContext.draw(true, setTimeout(()=>{},0))
      2021-06-02
      回复
    • 涂之包
      涂之包
      2021-06-03
      测试发现不兼容,不能用settimeout。直接作为回调执行即可
      2021-06-03
      2
      回复
    • 菜食はしないがジャガイモが好き
      菜食はしないがジャガイモが好き
      2023-03-07回复涂之包
      成功解决真不容易,谢谢大佬
      2023-03-07
      回复

正在加载...

登录 后发表内容