收藏
回答

真机测试画布getContext('2d')无法使用?

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug canvas 微信安卓客户端 7.0.8 2.9.3
wx.createSelectorQuery()
      .select('#myCanvas')
      .fields({
        node:true,
        size:true,
      })
      .exec((res) => {
        console.log(res[0])
      })

fields中读取node真机返回错误

Uncaught (in promise) ReferenceError: NativeGlobal is not defined
    at n.value ([publib]:1)
    at n.value ([publib]:1)
    at t ([publib]:1)
    at n.value ([publib]:1)
    at eval ([publib]:1)
    atnew Promise (<anonymous>)
    at t ([publib]:1)
    at eval ([publib]:1)
    at Array.forEach (<anonymous>)
    at eval ([publib]:1)

这是什么原因呢?测试机器 小米8、苹果X

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

3 个回答

  • HS
    HS
    2019-11-14

    感谢反馈,目前真机调试不支持直接获取 Canvas 的 context,现在可以以预览为准。请期待后续更新。

    2019-11-14
    有用 2
    回复
  • 小金
    小金
    2020-07-27

    遇到同样的问题,

    电脑端调试可以。

    手机端远程调试,即出现问题。

    使用手机端测试运行,不开启远程调试。正常。


    我使用wepy写的小程序。所以 就贴一个文件吧。

    第一个评论上面说不支持,感觉那个就是对的哦。


    <!--签名-->
    <style>
    @import "./common/lib/weui.wxss";
    </style>
    <template>
      <canvas type="2d" id="signcanvas" @touchstart="starttouch" @touchmove="touchmove" @touchend="touchend" style="width: 100vw; height: 92vh;"></canvas>
    
      <cover-view style="height: 8vh;">
        <button @tap="confirmSign" type="primary" class="weui-btn weui-btn_primary">签名确认</button>
      </cover-view>
    </template>
    <script>
    
      import wepy from 'wepy'
      import { connect } from 'wepy-redux';
      import { REPLACESIGNIMAGEFILEPATH } from '../store/types';
    
      @connect({}, {
        replaceSignImage: REPLACESIGNIMAGEFILEPATH
      })
    
      export default class welcome extends wepy.page{
    
        onLoad (option) {
          let that = this;
          // 初始化画布,
          const query = wx.createSelectorQuery();
          query.select('#signcanvas')
            .fields({ node: true, size: true })
            .exec((res) => {
              const canvas = res[0].node;
              that.canvas = canvas;
              const ctx = canvas.getContext('2d');
              that.canvasContext = ctx;
              const dpr = wx.getSystemInfoSync().pixelRatio;
              canvas.width = res[0].width * dpr;
              canvas.height = res[0].height * dpr;
              ctx.scale(dpr, dpr);
    
            });
        }
    
        config = {
          navigationBarTitleText: '签名'
        }
    
        data = {
          targetSrc: '',
          canvasContext: {},
          canvas: {}
        }
    
        methods = {
          starttouch: function (e) {
            console.log('start', e)
            this.canvasContext.beginPath();
            let touchevent = e.touches[0];
            this.canvasContext.moveTo(touchevent.x, touchevent.y);
          },
          touchmove: function(e) {
            console.log('move', e);
            let touchevent = e.touches[0];
            this.canvasContext.lineTo(touchevent.x, touchevent.y);
            this.canvasContext.stroke();
          },
          touchend: function(e) {
            console.log('end', e);
    
            // this.canvasContext.draw();
            // this.canvasContext.draw();
          },
          confirmSign: function(e) {
            let that = this;
            wx.canvasToTempFilePath({
              canvasId: 'signcanvas',
              canvas: that.canvas,
              success: (ctx) => {
                // 获得图片临时路径,用来保存到本地
                console.error('save', ctx);
                that.methods.replaceSignImage(ctx.tempFilePath);
              },
              fail: (err) => {
                console.error(err);
              }
            })
          }
        }
      }
    
    </script>
    
    
    2020-07-27
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2019-11-13

    你好,麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    2019-11-13
    有用
    回复 12
    • 张垚
      张垚
      2019-11-13
      代码片段:https://developers.weixin.qq.com/s/ksIQpQm87Xc5
      微信版本号:7.0.8
      机型:小米8 MIUI11.0.3
      基础库:2.9.3
      2019-11-13
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2019-11-13回复张垚
      代码片段能复现这个问题么?我这边测试未复现
      2019-11-13
      回复
    • 张垚
      张垚
      2019-11-14回复疯狂的小辣椒
      我将代码片段导入到一个新建项目,可以复现这个问题
      2019-11-14
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2019-11-14回复张垚
      意思是新建一个项目,然后把代码片段拷贝到新建的项目里就能复现?同样的代码在项目里能复现,代码片段不能复现?是只有上面提供的小米8能复现这个问题么?
      2019-11-14
      回复
    • 张垚
      张垚
      2019-11-14回复疯狂的小辣椒
      代码片段放到开发工具里面【真机测试】按钮不是不能点击的么?上传到小程序体验版,也是不好使的
      2019-11-14
      回复
    查看更多(7)
登录 后发表内容
问题标签