更新记录

0.0.1（2024-12-06） 下载此版本

首次发布

• 键盘组件；转账静态页面

平台兼容性

PanKeyboard 组件文档

概述

PanKeyboard 是一个自定义键盘组件，适用于需要数字输入的场景。支持小数输入、数值限制及自定义提交按钮文本等功能。

属性 (Props)

方法 (Methods)

事件 (Events)

返回值 (Return Value)

当触发 onChange 和 onSubmit 事件时，返回值是一个对象，包含以下属性：

示例用法

<template>
  <div>
    <pan-keyboard
      :isDecimal="true"
      :submitButtonText="'确认'"
      :toFixed="2"
      :maxValue="10000"
      :isCheck="true"
      @onChange="handleInputChange"
      @onSubmit="handleSubmit"
      @onError="handleError"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
    };
  },
  methods: {
    handleInputChange(value) {
      console.log('Input changed:', value);
    },
    handleSubmit(value) {
      console.log('Form submitted:', value);
    },
    handleError(error) {
      console.error('Error occurred:', error);
    }
  }
};
</script>

注意事项

1. 小数输入：当 isDecimal 为 false 时，键盘将不显示小数点按键。
2. 数值限制：输入值不能超过 maxValue，否则会触发 onError 事件。
3. 提交按钮：提交按钮的状态由 isCheck 控制，未通过校验时按钮将不可点击。
4. 设置初始值: 调用组件实例this.$refs.PanKeyboard.setKeyboard(1000)

希望这份文档能帮助你更好地理解和使用 PanKeyboard 组件。如果有任何问题或建议，请随时联系。