虚拟键盘 Keyboard & KeyboardPicker

平铺键盘 Keyboard

  1. <za-keyboard type="number"></za-keyboard>

键盘触发器 KeyboardPicker

  1. <za-cell title="拾取器触发">
  2.   <za-button slot="description" size="xs" @click="visible1 = true">开启</za-button>
  3. </za-cell>
  4. <za-keyboard-picker :visible.sync="visible1" type="number" @keyClick="handleChange1"></za-keyboard-picker>

Vue Script

<script name="vue">
const getValue = (v, key) => {
  if (key == 'delete') {
    return v.slice(0, -1)
  }
  return `${v}${key}`
}
export default {
  data() {
    return {
      visible1: false,
    }
  },
  methods: {
    handleChange1(key) {
      if (['close', 'ok'].indexOf(key) > -1) {
        return;
      }
      this.v1 = getValue(this.v1, key)
      console.log(this.v1);
    },
  },
};
</script>

API

keyboard Attributes

属性类型默认值可选值／参数说明
typestring'number'键盘类型，可选number,price,idcard

keyboardPicker Attributes

属性类型默认值可选值／参数说明
visiblebooleanfalse是否显示, 支持.sync 修饰符 (v2.3.0+)
typestring'number'键盘类型，可选number,price,idcard

keyboard & keyboardPicker Events

事件名称说明回调参数
key-click当点击键盘时触发的事件最新点击的值

Keyboard 虚拟键盘 - 图1