vue-keypad 适用于手机端的模拟数字小键盘
阅读 329 作者 zee

由于ios上的小键盘没有小数点,只能用模拟的方式实现一个键盘。该插件支持点击按下效果,长按删除快速删除功能。

安装依赖

npm install --save @zee.kim/vue-keypad

在项目的入口文件中引入, 调用 Vue.use 安装

import vueKeypad from '@zee.kim/vue-keypad'
Vue.use(vueKeypad)

模板

<div id="app">
    <div @click="input()">${{money}}</div>
    <keypad :show="keypad.show" @input="keypad.input"></keypad>
</div>

JS部分

export default {
  data() {
    return {
        money:"",
        keypad:{
            show:false,
            input:(value)=>{}
        },
    },
    methods:{
        input(){
            this.keypad.show=true;
            this.keypad.input=(value)=>{
                this.money=value;
            }
        }
    }
}

 

获取最新版本

https://github.com/jinzhe/vue-keypad