Skip to content
CONTENTS

Signature 签名

用于签名场景的组件,基于 Canvas 实现。

基础用法

当点击确认按钮时,组件会触发 submit 事件,事件的第一个参数为 data,包含以下字段:

  1. image:签名对应的图片,为 base64 字符串格式。若签名为空,则返回空字符串。
  2. canvas:Canvas 元素。

自定义颜色

通过 lineColor 来自定义笔触颜色。

自定义线宽

通过 lineWidth 来自定义线条宽度。

自定义背景颜色

通过 backgroundColor 来自定义背景颜色。

TIP

若保存的图片格式为 image/jpeg ,则不支持不保留背景色,默认为黑色

API

属性

属性名说明类型可选值默认值
backgroundColor画板背景色,不支持颜色名称(如:black)string--
lineColor画笔线条颜色,不支持颜色名称(如:black)string-#000
lineWidth画笔线条宽度number[1, 32] 范围内的整数3
reserveBackgroundColor保存时是否保留背景色,jpeg 格式不支持boolean-true
pictureFormat保存图片的格式stringimage/png / image/jpeg / image/webpimage/png
clear清除按钮文案string-清空
confirm确认按钮文案string-确认

事件

事件名说明参数
start开始签名时触发-
end结束签名时触发-
submit点击确定按钮时触发data: { image: string; canvas: HTMLCanvasElement }
clear点击取消按钮时触发-

Released under the MIT License.