vue3 实现电子签名

summer king

已于 2023-06-28 14:52:40 修改

阅读量651

点赞数

文章标签： javascript vue.js 开发语言

于 2023-06-28 14:50:50 首次发布

本文链接：https://blog.csdn.net/jinxia709/article/details/131436871

版权

vue3 实现电子签名

<template>
    <div class="signature-box">
        <div class="signature-canvas" ref="canvasBox">
            <canvas
                ref="signatureCanvas"
                @mousedown="handleMouseDown"
                @mousemove="handleMouseMove"
                @mouseup="handleMouseUp"
                @mouseout="handleMouseOut"
            ></canvas>
        </div>
        <div class="signature-btns">
            <div class="btn gray" @click="reWrite">重写</div>
            <div class="btn green ml20" @click="submitSignature">提交签名</div>
        </div>
        <div class="img-area">
          <img :src="imgSrc" />
        </div>
    </div>
</template>

<script setup lang="ts">
import {
    ref, onMounted } from