Canvas无法响应触摸事件是因为默认不冒泡且需显式开启disable-scroll="false"，并用canvas-id配合uni.createCanvasContext；签名抖动需除以dpr适配、加防抖、延迟draw；清空画布须重置上下文状态；导出图片要等draw完成并传入dpr缩放后的像素尺寸。
uni-app里Canvas画板无法响应触摸事件？
多数人卡在这一步：在<canvas></canvas>上绑了touchstart却没触发——因为uni-app的<canvas></canvas>组件默认不冒泡、不响应事件，必须显式开启disable-scroll="false"且用canvas-id配合uni.createCanvasContext，不能当普通DOM操作。
实操要点：
- 模板中必须写
<canvas canvas-id="signCanvas" disable-scroll="false"></canvas>，缺任一属性都可能失灵 - 真机调试时，iOS需额外加
touch-action: none（通过style绑定），否则系统手势会劫持拖拽 - H5端Canvas尺寸必须用
rpx或固定px，不能用%，否则getBoundingClientRect()计算偏移错乱
签名轨迹线条断开、抖动严重？
根本原因是touchmove频繁触发但坐标采样太密，直接逐点连线会产生锯齿和性能压力；更糟的是不同设备dpr差异导致pageX/pageY未适配屏幕像素比。
关键修复步骤：
- 用
uni.getSystemInfoSync().pixelRatio获取dpr，所有坐标都除以它再传给ctx.lineTo() - 加简单防抖：记录上一个点，距离小于5px则跳过本次
lineTo()，避免微小抖动 - 别用
stroke()每笔都重绘，改用draw(false)延迟提交，最后统一draw(true)，否则iOS Canvas渲染卡顿明显
示例片段：
const ctx = uni.createCanvasContext('signCanvas', this);
ctx.beginPath();
ctx.moveTo(lastX / dpr, lastY / dpr);
ctx.lineTo(currX / dpr, currY / dpr);
ctx.setStrokeStyle('#000');
ctx.setLineWidth(3);
ctx.stroke(); // 此处不立即绘制
ctx.draw(false); // 缓存
清空画布后再次签名变粗或颜色残留？
这是Canvas状态未重置的典型表现：setStrokeStyle、setLineWidth等设置是持久的，清空画布（clearRect）只擦像素，不重置绘图上下文状态。
每次开始新签名前必须手动重置：
- 调用
ctx.save()不是必须，但ctx.restore()不能代替重置——得显式调用ctx.beginPath()、ctx.setStrokeStyle('#000')、ctx.setLineWidth(3) - 清空逻辑不能只靠
ctx.clearRect(0, 0, width, height)，之后必须立刻ctx.draw()，否则旧内容可能残留（尤其Android低端机） - 如果用了
globalCompositeOperation = 'destination-out'做橡皮擦，清空前得先切回'source-over'
导出签名图片在某些机型模糊或截半？
Canvas.toTempFilePath在安卓部分厂商（如华为EMUI、小米MIUI）存在bug：未等draw()真正完成就执行导出，导致图片空白或裁剪异常；iOS则常因dpr未参与尺寸计算而模糊。
稳妥做法：
- 导出前加
setTimeout(() => { ... }, 100)，确保Canvas渲染队列清空（实测100ms覆盖99%机型） - 生成临时路径时，
width和height务必传入实际像素值（即rpx换算后 × dpr），不能传rpx数值 - 真机测试必须覆盖Android 10–13 + iOS 15–17，华为P40、小米12、iPhone 13是高频出问题机型
导出失败时fail回调里的错误信息通常是"canvas is empty"或"invalid canvas size"，此时优先检查dpr乘法是否漏了或为0。
手写签名最麻烦的从来不是画线，而是不同屏幕密度下坐标映射、Canvas状态管理、以及各端异步时机的微妙差异——这些地方少一个/dpr或晚一次draw()，用户就签不上名。
