收藏
回答

iOS createSelectorQuery 获取 canvas 返回 node 为 null

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug createSelectorQuery 微信iOS客户端 8.0.23 2.24.7[776]

复现流程:真机调试 => 右上角更多菜单 => 转发给朋友(不需要真的分享出去);此刻就可以看到错误了

iPhone 设备 iOS13 及其以上不会出现该问题

设备信息:iPhone 7 Plus【iOS 12.1.4】

代码片段截图:

错误内容截图:

回答关注问题邀请回答
收藏

3 个回答

  • 卧槽,无情
    卧槽,无情
    2022-07-22

    小程序canvas不支持真机调试。。。文档也不说明一下,有点坑。。

    2022-07-22
    有用 1
    回复 2
    • Mi
      Mi
      2022-11-14
      这个问题正式版本不会出现吗?
      2022-11-14
      回复
    • magic-er
      magic-er
      2022-12-08
      真机上不行,pc上的开发者工具也不行,那咋整
      2022-12-08
      回复
  • 半块苹果
    半块苹果
    02-07

    解决了,加定时器就可以!

    我的代码里 canvas 是用户选择图片后根据图片数量 imageList 渲染的,然后获取 canvas 也是 null,之前的代码如下:

    wx.getImageInfo({
      src: imageList[i],
      success: (res) => {
        console.log('%c getImageInfo: ', 'background-color: pink', res)
       wx.createSelectorQuery()
          .select(`#${canvasId}`)
          .fields({ node: true, size: true })
         .exec((res2) => {
           console.log('%c res2[0]: ', 'background-color: pink', res2[0]) // null
      })
    }
    


    canvas 是根据 imageList 渲染的,我怀疑是获取图片后 canvas 并没有第一时间渲染,或者在我 select 的时候还没有渲染完,所以加了定时器,把 select 动作往后放。

    wx.getImageInfo({
      src: imageList[i],
      success: (res) => {
       console.log('%c getImageInfo: ', 'background-color: pink', res)
       setTimeout(() => {
          wx.createSelectorQuery()
            .select(`#${canvasId}`)
            .fields({ node: true, size: true })
            .exec((res2) => {
              console.log('%c res2[0]: ', 'background-color: pink', res2[0])
                  // res2[0] 可以获取到了
         }, 0);
      })
    }
    


    解决!

    -------------------------------------------------

    这个回复的编辑器可真tm难用!!!!!

    02-07
    有用
    回复
  • 李林
    李林
    2022-12-05

    最后怎么写的,我也想像你这么写,把createSelectorQuery获取到的组件作为函数返回值

    2022-12-05
    有用
    回复 1
    • 李林
      李林
      2022-12-06
      昨天没理解js的回调函数是什么意思,现在这么写解决问题
      function getcanvas(callback){
        wx.createSelectorQuery()
          .select('#myCanvas')
          .fields({
            node: true,
            size: true
          })
          .exec((res) => {
            callback(res[0])
          })
      }
      当需要引用getcanvas时这么写
      function drawcanvas(){
       getcanvas((res0)=>{
        const canvas=res0.node
      })
      }
      function drawcanvas_2(){
       getcanvas((res0)=>{
        const canvas=res0.node
      })
      }
      2022-12-06
      回复
登录 后发表内容