介绍

基于vue2.0的数字键盘组件

组件使用

安装

npm install jx-vue2-keyboard --save

使用

<template>
  <div id="app">
    <keyboard 
    :show="showKeyBoard"
    title="请输入数字"
    :decimalsLen="3"
    btnColor="#F23838"
    @getVal="getKeyBoardVal"
    @close="showKeyBoard=false" 
		></keyboard>
  </div>
</template>
 <script>
 import keyboard from 'jx-vue2-keyboard'; 
 export default {
  name: 'App', 
  data() {
    return {
      showKeyBoard: false,
      amount: ''
    }
  },
  components: {
    keyboard
  },
  methods: {
    getKeyBoardVal(val) {
      this.showKeyBoard = true; 
      this.amount = val;
    } 
  } 
 }
 </script>

属性配置说明

show  是否显示键盘；
title 键盘标题；
decimalsLen 数字最大位小数；
btnColor 确定按钮颜色；
@getVal 获取输入的值；
@close 关闭键盘