小程序
小游戏
企业微信
微信支付
扫描小程序码分享
api组件名称：canvas，最低基础库：2.20.2，pc微信版本号：3.9.0.28
问题描述：使用canvas开发签字板功能，初次打开pc端小程序可使用，使用几次过或一段时间之后，再次使用，canvas的相关事件均无法触发导致无法使用
6 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
请具体描述问题出现的流程，并提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
解决了吗？我也遇到这个问题，PC端小程序touch事件全部失效，但是同事的pc端小程序又可以...微信小程序的版本而且还是一样的
都2024了，PC端小程序canvas事件还是不能正常触发
大佬们，这个问题解决没有？？？？？？？？
遇到同样问题，pc端的签字失灵了，签不上
<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);
context1: context1,
hasDraw : true, //要签字了
});
canvasTouchMove: function(e) {
console.log('touchmove1===11111==>>',e)
var x = e.touches[0].x;
var y = e.touches[0].y;
context1.setLineWidth(3);
context1.lineTo(x, y);
context1.stroke();
context1.setLineCap('round');
context1.draw(true);
context1.moveTo(x, y);
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
请具体描述问题出现的流程，并提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。
解决了吗？我也遇到这个问题，PC端小程序touch事件全部失效，但是同事的pc端小程序又可以...微信小程序的版本而且还是一样的
都2024了，PC端小程序canvas事件还是不能正常触发
大佬们，这个问题解决没有？？？？？？？？
遇到同样问题，pc端的签字失灵了，签不上
<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);
},