更新记录

1.0.0（2026-09-01） 下载此版本

• 首次发布。
• 支持数字输入、退格、确认、隐藏、清空、长度限制和禁用状态。
• 支持 Vue 2 v-model 和 Vue 3 v-model。
• 移除第三方 UI 组件依赖。

平台兼容性

uni-app(4.76)

其他

sy-number-keyboard 数字键盘

轻量、无第三方依赖的 uni-app 数字键盘组件，适合 PIN 码、支付密码、家长验证和短信验证码等纯数字输入场景。

安装

在 DCloud 插件市场导入后，组件会安装到 uni_modules/sy-number-keyboard。组件符合 easycom 规范，无需手动引入或注册。

基础用法

<template>
  <sy-number-keyboard
    v-model="code"
    :visible.sync="keyboardVisible"
    :maxlength="6"
    confirm-text="确定"
    @complete="handleComplete"
    @confirm="handleConfirm"
  />
</template>

<script>
export default {
  data() {
    return {
      code: "",
      keyboardVisible: true
    };
  },
  methods: {
    handleComplete(value) {
      console.log("输入完成", value);
    },
    handleConfirm(value) {
      console.log("点击确认", value);
    }
  }
};
</script>

Vue 3 中可使用 v-model:visible="keyboardVisible" 绑定显示状态。

Props

组件会过滤非数字字符，并按 maxlength 截断外部传入的值。

Events

Methods

通过 ref 调用 clear() 可清空当前输入：

this.$refs.keyboard.clear();

隐私与权限

组件不访问网络、不采集数据、不使用系统权限，也不包含广告。