更新记录

1.0.10(2021-12-21) 下载此版本

上传包

1.0.9(2021-12-21) 下载此版本

更新包

1.0.8(2021-12-21) 下载此版本

更新【package.json】配置

查看更多

平台兼容性

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

zm-keyboard-number

1、导入方式

  • 1、使用HBuilderX导入插件
  • 2、下载插件ZIP
  • 3、node 导入
  • 3.1、在【package.json】文件中添加导入配置
    "dependencies": {
    "zm-keyboard-number": "^1.0.10"
    }
  • 3.2、打开项目中的终端,输入:
    npm install
  • 3.3、下载成功后在【node_modules】中显示

2、使用

2.1、uni_modules导入

该方式导入组件支持easycom组件模式,可以不用引用、注册,直接在页面中使用。如下:

1、组件使用

<zm-keyboard-number @keyinput="onKeysInput" @del="onKeysDel" />

2、方法实现

data() {
    return {
        smsCode: '12', // 验证码
        codeLength: 4,
    }
},

methods: {
    // 键盘 - 监听键盘变化
    onKeysInput(item) {
        if (this.smsCode.length > this.codeLength - 1) {
            return false;
        }
        this.smsCode = this.smsCode + item.key;
    },

    // 键盘 - 点击删除按钮
    onKeysDel(item) {
        let temp = this.smsCode.split('') || [];
        temp.pop();
        this.smsCode = temp.join("");
    },
},

2.2、npm导入

组件引用与注册

import ZmKeyboardNumber from "zm-keyboard-number/components/zm-keyboard-number/zm-keyboard-number.vue"

components: {
    ZmKeyboardNumber
},

其余步骤通【2.1】一致

  • 插件ZIP下载导入项目,使用的时候,除了注册引用的路径不一致,其他全部一致

隐私、权限声明

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

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

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

许可协议

MIT协议

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