收藏
回答

小程序Canvas在PC端打开bindtouchstart,bindtouchmove无法触发?

api组件名称:canvas,最低基础库:2.20.2,pc微信版本号:3.9.0.28

问题描述:使用canvas开发签字板功能,初次打开pc端小程序可使用,使用几次过或一段时间之后,再次使用,canvas的相关事件均无法触发导致无法使用

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

6 个回答

  • Demons
    Demons
    2023-02-08

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

    2023-02-08
    有用
    回复 8
    • Peripateticism
      Peripateticism
      2023-02-08
      无法准确复现。只能在PC端打开小程序一段时间后才会出现,我的代码贴在下面了
      2023-02-08
      回复
    • Peripateticism
      Peripateticism
      2023-02-08
      在出现问题的微信客户端PC上,使用其他的canvas的小程序,也都无法签字,画空白。
      2023-02-08
      回复
    • Peripateticism
      Peripateticism
      2023-02-08
      只有重装微信客户端或者切换微信账号才能解决,但是使用一段时间后,又会出现
      2023-02-08
      回复
    • 飞儿
      飞儿
      2023-02-28
      这个问题解决了吗?
      2023-02-28
      回复
    • Peripateticism
      Peripateticism
      2023-03-07回复飞儿
      没有,在测试中发现,可以用的环境,升级最新版的微信之后就不行了
      2023-03-07
      回复
    查看更多(3)
  • 唯一
    唯一
    2023-04-28

    解决了吗?我也遇到这个问题,PC端小程序touch事件全部失效,但是同事的pc端小程序又可以...微信小程序的版本而且还是一样的

    2023-04-28
    有用 1
    回复
  • 神经蛙
    神经蛙
    01-24

    都2024了,PC端小程序canvas事件还是不能正常触发

    01-24
    有用
    回复
  • 张学昆
    张学昆
    2023-11-27

    大佬们,这个问题解决没有????????

    2023-11-27
    有用
    回复
  • 神经蛙
    神经蛙
    2023-05-31

    遇到同样问题,pc端的签字失灵了,签不上

    2023-05-31
    有用
    回复
  • Peripateticism
    Peripateticism
    2023-02-08

    <canvas class="handWriting" disable-scroll="true" bindtouchstart="canvasTouchStart" bindtouchmove="canvasTouchMove"  id="handSigin" canvas-id="handWriting1"/>



     startCanvar(){

        var that = this

        const query = wx.createSelectorQuery()

        query.select('#handSigin').fields({node:true,size:true,context:true}).exec(function  (res){

            console.log('canvas====>',res)

            const canvas = res[0]

            const ctx = canvas.context

           // ctx.fillStyle = 'red'

           // ctx.fillRect(0, 0, 100, 100)

           

           that.setData({

                context1: ctx,

            })


         })

        }, 

        canvasTouchStart(e) {

            console.log('touchstart1==1111==>>',e)

          if(!this.data.isSingDialog){

            this.setData({

              dialogShow:true,

              showCanbans:false

            })

            return

          }

          var context1 = this.data.context1;

          context1.moveTo(e.touches[0].x, e.touches[0].y);

          this.setData({

            context1: context1,

            hasDraw : true, //要签字了

          });

        },

        canvasTouchMove: function(e) {

            console.log('touchmove1===11111==>>',e)    

          if(!this.data.isSingDialog){

            return

          }

          var x = e.touches[0].x;

          var y = e.touches[0].y;


          var context1 = this.data.context1;

          context1.setLineWidth(3);

          context1.lineTo(x, y);

          context1.stroke();

          context1.setLineCap('round');

          context1.draw(true);

          context1.moveTo(x, y);

        },


    2023-02-08
    有用
    回复
登录 后发表内容