vue-ele-sign

v1.0.10

Published

4 years ago

电子签名

0High
0Medium
0Low

ercyao

signature 电子签名签名

项目说明

基于https://github.com/yinhui1129754/elesigncode的代码，二次处理目前适用vue下的一个电子签名插件 vue-ele-sign

安装依赖命令

 npm i vue-ele-sign --save-dev

使用例子

<vue-ele-sign ref="VueEleSign" :color="color" :bgImg="bgImg" :readOnly="readOnly" />
    ...
import VueEleSign from 'vue-ele-sign'
components: { VueEleSign }
    ...

运行项目

 npm install
 npm run serve

构建npm包

 npm run build-bundle

 .更新包版本
 npm publish

class

我们这个类所需要的的所有类

data 数据类
 draw 绘制类
 event 事件类
 image 图片类
 line 线段类
 main 核心类
 point 点类

core

我们这个类的中心脚本

untils

各种方法和工具

config.js 默认配置项

struct.js 没有使用到，结构字典表

untils.js 工具方法类

在vue-cli中使用我们的组件

详细可以看在vue中使用此组件

实例对象的时候可传入的参数

对象主要方法说明

|方法名称|描述|参数|返回值| |:-|-:|-:|-:| |init|初始化方法|无|无| |moutedEle|挂载到节点下|ele:传入的节点|无| |resize|重置签名canvas节点大小到挂载节点的大小，一般可以和resize混合使用|无|无| |resizeWithNumber|重置签名canvas节点大小到传入的宽度和高度|w:宽度,h:高度|无| |destory|销毁对象:实例的对象的所有属性没有了事件取消绑定,canvas节点从挂载节点移出|无|无| |drawEle|强制重新绘制数据|无|无| |undo|撤销方法|无|无| |redo|重做方法|无|无| |toJson|将当前实例签名的数据转化为json|无|无| |jsonTo|将传入的json数据转化到当前对象|json|无| |imgTo|将传入的img地址显示在图层|string|无| |toPng|获取当前签名的base64位数据png类型|无|无| |toJpeg|获取当前签名的base64位数据jpeg类型|无|无| |setColor|设置签名的颜色|color:颜色字符串rgb hex均可以|无| |setLineWidth|设置线宽|lineWidth:线宽|无| |setBgColor|设置背景颜色|bgColor:颜色字符串rgb hex均可以|无| |setBgImg|设置背景图片|无|无| |setPen|设置笔的类型|name:'default' 'writing'|无| |clear|清除全部|无|无| |clearSign|清除签名|无|无| |getImg|获取图片地址|无|无| |getFile|获取file数据|filename:文件名|无| |getData|获取全部数据|filename:文件名|file：file文件，url：图片地址，datas：笔迹json数据| |setReadOnly|设置只读|type:是否只读|无|