Keyboard 键盘组件

<el-form :inline="true">
  <el-form-item label="输入框1">
    <el-input  ref="text" id="text" v-model="text" placeholder="点击我，完后用虚拟键盘输入"></el-input>
  </el-form-item>
</el-form>
<avue-keyboard ref="kb" :ele="ele" :keys="keys" @click="handleKeyboardClick" style="width: 800px; height: 300px">
</avue-keyboard>
<script>
export default {
  data() {
      return {
        // keys: [
        //   ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
        //   ['a', 'b', 'c', 'd', 'Shift', '清空']
        // ],
        text: '',
        ele: 'text'
      }
    },
    mounted() {
      this.$refs.text.focus();
      // 自定义按键绑定click
      this.$refs.kb.bindClick("清空", () => {
        this[this.ele] = ''
      })

      // 模拟更换输入框
      setTimeout(() => {
        this.ele = "text2"
      }, 5000);
    },
    methods: {
      // 键盘点击
      handleKeyboardClick(key, val) {
        this[this.ele] = val
      }
    }
}
</script>