小程序手写签名（wepy）

对于手写签名组件组件晚上有很多种写法，我选择了一种进行了wepy的框架的改造。如果使用wepy框架做手写签名的话可以直接复制下面的代码。

这里需要提醒的是：安卓手机和苹果手机有适配性的问题，苹果手机在签名的以后手机将无法进行文档的上下左右的滑动，而安卓手机没有影响。解决这个问题的方法是给canvas给disable-scroll属性绑定一个变量 disable-scroll="true" 当进行滑动的时候讲disable-scroll属性设置成true,滑动完成时将属性还原为false.

  <template>
>
canvas-id"firstCanvas"bindtouchmove'move'bindtouchstart'start'bindtouchend'end'bindtouchcancel'cancel'bindlongtap'tap'disable-scroll'true'binderror'error'>
<buttonbindtap'clearClick'>清除</button>
保存图片</button>
src'{{signImage}}'></image>
</view>
<script>
import wepy from 'wepy';
 touchs  [];
 canvash ;

    config {};
    data {
,
    events {};
        startfunction(event){
// console.log("触摸开始" + event.changedTouches[0].y)
            let point {
                yy
            touchspushpoint)
        // 画布的触摸移动手势响应
 etouches}

            iftouchslength >=2{

        cancel            consolelog("触摸取消"+)
// 画布的长按手势响应
"长按手势")
        error"画布触摸错误")
// 画布的触摸移动结束手势响应
"触摸结束")
forlet i ; i < touchslength i++)                touchspop()
};
    async onLoadoptions//获得Canvas的上下文
//设置线的颜色
setLineWidth(5//设置线两端端点样式更加圆润
//设置两条线连接处更加圆润
}
        let point2 1]
stroke()
}
clearRect canvasw canvash)
         that this
            canvasId            successres                //打印图片路径
                thatsetData({
                })
}
</script>
content     width100%;
firstCanvas  blue;
200px;
image  orange</style>