## Signature电子签名组件

### 相关知识点
* Touch
* Canvas

### 组件内容
<p>电子签名组件目前包含以下内容</p>
<p>配置数据: 线条宽度与颜色、画布颜色与提示文案</p>
<p>支持行为: 手指画线条、画布重置、生成Base64图片</p>
<p>支持事件: 单个手指touchStart、单个手指touchMove、单个手指touchEnd</p>
<p>说明: 该组件无样式,目前只提供接口,电子签名生成的是Base64图片,需要使用Uploader组件转为File文件进行上传并返回CDN链接,可在[工程DEMO](https://github.com/qiuguorong/hello-ui/blob/master/src/views/Signature.vue)中查看具体实现。</p>

### 如何使用
npm
```shell
## 未安装package
npm install hello-ui --save-dev
## 已安装package
npm update hello-ui --save-dev
```
html
```html
<div class="bx-signature"></div>
```
import as module
```js
// 使用全部组件情况
import Hello from 'hello-ui';
var signature = new Hello.Signature('.bx-signature');
// 只使用Signature组件情况
import {Signature} from 'hello-ui';
var tab = new Signature('.bx-signature');
```

### API
| 参数| 说明 | 类型 | 默认值 |
| --- | --- | --- |  --- |
| lineWidth | 可选,线条宽度 | Number | 3 |
| penColor | 可选,线条颜色 | String | #000 |
| backgroundColor | 可选,画布颜色 | String | #FFF |
| placeholder | 可选,提示文案 | String | 请在白色区域内 横向签名 |
| onInit | 可选,初始化回调事件 | Function | noop |
| onBegin | 可选,笔画开始回调事件 | Function | noop |
| onUpdate | 可选,笔画滑动回调事件 | Function | noop |
| onEnd | 可选,笔画结束回调事件 | Function | noop |

### Example
[功能预览](https://qiuguorong.github.io/hello-ui/dist/#/signature)
<p></p>
简单功能, 都使用默认值
```js
var signature = new Signature('.bx-signature');
```
定制功能, 可自选属性
```js
var signature = new Tab('.bx-signature', {
  lineWidth: 3,
  penColor: '#000',
  backgroundColor: '#FFF',
  placeholder: '请在白色区域内 横向签名',
  onInit: function () {},
  onBegin: function () {},
  onUpdate: function () {},
  onEnd: function () {}
});
```

### 设备兼容
暂无