Feng - 2020年12月
type: channel
link: http://www.fengyitong.name/index.php/2020/12/
description: 半山腰的风采
items: UNI-APP 签名画板封装

UNI-APP 签名画板封装
type: item
date: 2020-12-20T11:57:00+08:00
description: 前段时间公司有需要用户签名的功能开发,我针对签字封装了一个组件,方便使用,在安卓,ios,h5,微信小程序中测试通过,其他环境未进行测试.github地址:https://github.com/aoobao/signature核心组件所在文件 components/SignaturePad/SignaturePad.vue组件中有使用到uview-ui的popup组件,使用前需要引入uview组件库https://www.uviewui.com/基本使用方法可参考页面 pages/index/index将组件引入到template中 .... js代码调用this.$refs.signature .sign({ width: '700rpx', // 画板宽度 height: '500rpx', // 画板高度 color: '#000' // 画笔宽高 }) .then(path => { console.log(path); // 图片输出路径(h5页面为base64) }) .catch(e => { console.log('取消签名', e); }); 效果展示https://aoobao.github.io/signature/signature.mp4