调用clearRect这个方法无效,再绘制时还会保留上次绘制的线条,请问有没有方法解决?
组件:canvas 2D, 基础库:2.10.3;
//页面:
//初始化如下:
createCanvas() {
const query = wx.createSelectorQuery()
query.select('#testCanvas').fields({ node: true, size: true }).exec((res) => {
const canvas = res[0].node
const ctx = canvas.getContext('2d')
const dpr = wx.getSystemInfoSync().pixelRatio
canvas.width = res[0].width * dpr
canvas.height = res[0].height * dpr
ctx.scale(dpr, dpr)
ctx.lineGap = 'round'
ctx.lineJoin = 'round'
ctx.lineWidth = 2
ctx.font = ' 40rpx Arial'
ctx.fillStyle = 'rgba(0,0,0,.3)'
ctx.fillText("签名区", res[0].width / 2, res[0].height/2)
this.setData({ ctx, canvas})
})
}
// 绘制
start(e) {
this.data.ctx.moveTo(e.changedTouches[0].x, e.changedTouches[0].y)
},
move(e) {
this.data.ctx.lineTo(e.changedTouches[0].x, e.changedTouches[0].y)
this.data.ctx.stroke()
},
//清屏代码如下:
this.data.ctx.clearRect(0, 0, this.data.canvas.width, this.data.canvas.height)
调用完clearRect方法,在进行绘制还是会保留上次的记录。请问这里有没有什么出错的地方或者是2D的bug?怎么解决呢?