数字键盘 Keyboard & KeyboardPicker

基本用法

<template lang="html">
      <div>
     <div class="demo-hidden">
         <za-panel>
          <za-panel-header title="类型"></za-panel-header>
          <za-panel-body>
            <za-cell title='数字' @click="showPicker('visible1')">
              {{v1}}
            </za-cell>
            <za-cell title='金额' @click="showPicker('visible2')">
              {{v2}}
            </za-cell>
             <za-cell title='证件' @click="showPicker('visible3')">
              {{v3}}
            </za-cell>
          </za-panel-body>
        </za-panel>
        <za-panel>
          <za-panel-header title="键盘"></za-panel-header>
          <za-panel-body>
            <za-keyboard type="number" ></za-panel-header>
          </za-panel-body>
        </za-panel>
        <za-keyboard-picker :visible.sync="visible1" type="number" @keyClick="handleChange1" ></za-keyboard-picker>
        <za-keyboard-picker :visible.sync="visible2" type="price" @keyClick="handleChange2" ></za-keyboard-picker>
        <za-keyboard-picker :visible.sync="visible3" type="idcard" @keyClick="handleChange3" ></za-keyboard-picker>
      </div>
      </div>
</template>
<script>
export default {
  data() {
    return {
      v1:'',
      v2:'这是一个textarea',
      v3:'',
      v4:'',
      v5:'',
      v6:'',
      v7:'327198092039342',
    }
  },
  methods: {
    handleChange(v) {
      console.log(this.v1, v);
    },
    handleChange2(v) {
      console.log(this.v2, v);
    },
    handleChange3(v) {
      console.log(v);
    },
    focus() {
      this.$refs.inputFirst.focus()
    },
  },
};
</script>

API

keyboard Attributes

keyboardPicker Attributes

keyboard & keyboardPicker Events