1.1.7 • Published 3 years ago

vue-signatureboard v1.1.7

Weekly downloads
-
License
MIT
Repository
-
Last release
3 years ago

一个基于sign-canvas二次开发的签名板,加入的特性有绘制了签名板的样式在PC端是弹出框,在移动端是全屏横着(点击确定时canvas处理成正的)。用了边缘检测即导出的图片为比名字稍大点的png透明base64。支持国际化。

sign-canvas作者信息:更多文章和技术推文,请关注微信公众号"笔优站长",有问题也可以及时反馈哦!

sign-canvas npm地址:https://www.npmjs.com/package/sign-canvas,仓库地址:https://github.com/langyuxiansheng/vue-sign-canvas

avatar avatar

下载

npm i -S vue-signatureboard

更新

@1.1.7 css调整 @1.1.6 写死手机端后同时样式进行强行变更 @1.1.5 加入写死为手机端配置 @1.1.4 按钮间距修改,x的icon背景变成白色 @1.1.3 手机旋转是按钮样式修正 @1.1.2 没想到手机还会旋转!!!,针对手机旋转的情况再写一套css,js在点击时获取是否手机旋转了。如果旋转输出正向图片,未旋转输出倒置图片。 @1.1.1 样式微调 @1.1.0 更改文字间距和按钮间距 @1.0.9 由于签字板阻止默认事件和冒泡,显隐改为直接出现而不是渐变出现 @1.0.8 解决某些手机文字不倒转问题 @1.0.7 关闭按钮修改

全局引入

import sign from 'vue-signatureboard'; import 'vue-signatureboard/lib/vue-signatureboard.css'; // 1.0.5版本及以后不用 Vue.use(sign);

局部引入

import sign from 'vue-signatureboard'; import 'vue-signatureboard/lib/vue-signatureboard.css';// 1.0.5版本及以后不用

components: { sign, }

使用

<sign @confirm="getImage" :is-en="true">

methods: { getImage(base64Img){ console.log(base64Img); } }

API

属性说明类型默认值版本
confirm绘制成功后的回调函数,获取的是base64图片Function
is-en国际化配置,英文true,中文falseBooleanfalse
scale绘制完成后图片比例,例如需要0.5倍大小的签名,:scale=0.5Number0.5
useMobile使用手机端,当值为''时是PC端,不为''时为Mobile端String''1.1.6

加入refs后的API

函数说明用法
show显示或隐藏签名板,默认隐藏(1.0.6以后)this.$refs.pf.show()

其他API请参照sign-canvas

1.1.7

3 years ago

1.1.6

3 years ago

1.1.5

3 years ago

1.1.4

3 years ago

1.1.3

3 years ago

1.1.2

3 years ago

1.1.1

3 years ago

1.1.0

3 years ago

1.0.9

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago