远程调试带有canvas组件的页面时开发工具抛出r.canvas异常
发布于 6 年前 作者 uchang 3764 次浏览 来自 问答

新建一个小程序项目,

1、在pages/index.wxml中加入:

 <canvas type=‘2d’ id=‘testcanv’ style=‘width:100%;height:300px’></canvas>

2、在app.js:onLoad中加入:

 wx.createSelectorQuery().select(’#testcanv’).node((res)=>{

      if (res && res.node) {

        let {node:canvas}=res       

        console.log(‘found node!’)

        wx.getSystemInfo({success:sysinfo=>{

          let s = “hello world”

          let ctx = canvas.getContext(‘2d’)

          ctx.font = “32px bold Arial”

          let w=ctx.measureText(s).width                   

          ctx.fillText(s, sysinfo.screenWidth/2-w/2, 32)

        }})

      }

      else console.log(‘node not found’)

    }).exec() 

3、点击远程调试(测试机分别使用iPhoneXR 及 华为M6 pad, 系统及微信均更新到最新版), 开发工具抛出以下异常: 

runtime.js?devtools_ignore=true:1 eval script evaluate_id #12 failed TypeError: r.Canvas is not a constructor

    at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:733280)

    at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:621289)

    at t (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:621461)

    at b (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:620332)

    at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:732657)

    at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:717590)

    at Object.m (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:77498)

    at Object.value [as subscribeHandler] (runtime.js?devtools_ignore=true:1)

    at eval (eval at c (runtime.js?devtools_ignore=true:1), <anonymous>:1:17)

    at eval (<anonymous>)

1 回复

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

回到顶部