npm下载量：![downloads](https://img.shields.io/npm/dt/c-number-pad)
# 欢迎使用 c-number-pad

## 安装
```javascript
// npm安装方式，插件市场导入无需执行此命令。插件市场导入地址：https://ext.dcloud.net.cn/plugin?id=23049
npm install c-number-pad
```

## 使用方法
```javascript
<template>
    <view class="box">
		当前键盘输入的值：{{ numberVal }}
        <c-number-pad
			v-model="numberVal"
			:show="show"
			@confirm="onConfirm"
		/>
    </view>
</template>

<script>
	// 以下导入方式按照安装方式导入，二选一
    // 插件市场导入方法：无需引入，可直接使用
	import cNumberPad from "c-number-pad/components/c-number-pad/c-number-pad.vue";		// npm导入方法
    export default {
		// npm导入需要添加components，插件市场导入不需要
        components: {
            cNumberPad
        },
        data() {
            return {
				show: true,
				numberVal: ""
            }
        },
		methods: {
			onConfirm(e) {
				console.log("点击键盘确认键");
				console.log("当前键盘输入的值：", e);
				console.log("当前键盘输入的值：", this.numberVal);
			}
		}
    }
</script>
```

## API
### Props
|参数|说明|类型|默认值|可选值|
|--|--|--|--|--|
|v-model|输入的值|String|-|-|
|show|是否显示键盘|Boolean|false|true|
|safeAreaInsetBottom|是否开启底部安全区适配|Boolean|true|false|
|showPoint|是否显示小数点|Boolean|true|false|
|decimalPlaces|限制小数位数，-1则无限长度|Number|2|-|
|maxlength|输入的长度，0则无限长度|Number|0|-|
|zIndex|键盘层级|Number|800|-|
|fontSize|整体的字体大小，单位：rpx|String\|Number|32|-|
|boxBgColor|整个键盘的背景色|String|#f4f4f4|-|
|boxStyle|盒子样式|Object|{}|-|
|confirmText|确认键文字|String|确认|-|
|confirmColor|确认键文字颜色|String|#fff|-|
|confirmBg|确认键背景|String|linear-gradient(to bottom, #ff7979, #ff0000)|-|
|confirmStyle|确认键样式|Object|{}|-|
|keyBg|按键背景色，0-9和小数点的背景色|String|#fff|-|
|delBg|删除键的背景色|String|#fff|-|
|delColor|删除图标的颜色|String|#000|-|
|delSize|删除图标的大小，单位：rpx|String\|Number|60|-|

### Events
|事件名|说明|回调参数|
|--|--|--|
|key|按键点击事件|e|
|del|删除按钮事件|-|
|confirm|右下角确认按钮事件|e|