html:
<canvas style="width: 300px; height: 400px;" canvas-id="myCanvas" @touchstart="canvasStart($event)" @touchmove="canvasMove($event)"></canvas>
JS:
data() {
return {
startX: 0,
startY: 0
}
},
methods: {
canvasStart(event) {
this.startX = event.touches[0].x
this.startY = event.touches[0].y
},
canvasMove(event) {
event.preventDefault()
const ctx = uni.createCanvasContext('myCanvas')
ctx.beginPath()
ctx.moveTo(this.startX, this.startY)
ctx.lineTo(event.touches[0].x, event.touches[0].y)
ctx.stroke()
ctx.draw(true)
this.startX = event.touches[0].x
this.startY = event.touches[0].y
}
}