更新记录

1.0.2(2022-03-15)

1、更新button组件以及navBar组件(可以作为全局组件使用) 2、button组件可以继续二次开发,根据场景需要加入自定义按钮,通过‘buttonConfirm’触发按钮响应并识别; 3、navBar组件主要用于标题展示,leftIcon、title、righticon事件触发完成相应功能;

ps: 涉及到多流程单页面功能开发时,button组件可以结合js策略模式完成功能定制。

1.0.1(2022-03-14)

1、nav-bar button 组件尚未更新,可参考css优先

1.0.0(2022-03-14)

1、初始化横屏签名组件

查看更多

平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
× × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

平台兼容性

Vue2 Vue3
×
App 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序 快应用
app-vue × × × × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × ×

参数说明

参数 类型 默认值 说明
showSignature Boolean false 控制组件显示隐藏

事件说明

参数 类型 默认值 说明
commit event - 签名后返回签名base64

使用

1、page内使用

<template>
    <view>
         <hs-signatures
        :showSignature.sync="showSignature"
         @commit="commit"
    ></hs-signatures>
    </view>
</template>

<script>
import sign from "@/utils/mixins/sign.js";
export default{
    data(){
         showSignature: false,
             userInfo:null,
    },
     mixins: [sign],
    methods:{
        commit(val){
            //val为传入的base64
            //执行你的图片上传方法,我这边因为签名地方很多,就写到mixins里面了,下面代码块是我的mixins,这个根据自己的业务方式来写就可以了
             this.signUpload(val, this.userInfo.ssds_id).then((res) =>{
                 //功能块
             })
        }
    }
}
</script>
import { upload } from "@/api;
export default {
    methods: {
        /**
         * 上传签名
         * @param {String} base64Content
         * @param {String} ssds_id 路径id
         */
        signUpload(base64Content, ssds_id) {
            const files = this.$commonHelper.dataURLtoFile(
                base64Content,
                this.$commonHelper.getRandom() + ".png"
            );
            uni.showLoading({
                title: '签名上传中',
                mask: true
            })
            return new Promise((resolve, reject) => {
                upload({ ssdsId: this.userInfo.ssds_id }, files).then(res => {
                    uni.hideLoading();
                    let obj = {
                        imgName: res.name,
                        time: this.$tools.format(new Date(), 'yyyy-MM-dd hh:mm')
                    }
                    resolve(obj);
                })
            })
        }
    }
}

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问