KeyBoard 数字键盘

使用指南

组件介绍

数字键盘组件

引入方式

import { KeyBoard } from 'feart';

export default {
  components: {
    'fe-key-board': KeyBoard,
  },
  data() {
    return { keyboard: '' };
  },
  methods: {
    hideKeyBoard() {
      this.keyboard = '';
    },
    onInput(text) {
      alert(text);
    },
  },
};

代码演示

默认数字键盘

<fe-button @click.native="keyboard = 'null'">默认数字键盘</fe-button>
<fe-key-board :show="keyboard === 'null'" @blur="hideKeyBoard" @input="onInput"></fe-key-board>

带标题数字键盘

<fe-button @click.native="keyboard = 'title'">带标题数字键盘</fe-button>
<fe-key-board
  :show="keyboard === 'title'"
  @blur="hideKeyBoard"
  @input="onInput"
  :title="'标题'"
  show-title-close
  :close-button-text="'确定'"
></fe-key-board>

主题 default 数字键盘

<fe-button @click.native="keyboard = 'default'">主题default数字键盘</fe-button>
<fe-key-board
  :show="keyboard === 'default'"
  @blur="hideKeyBoard"
  @input="onInput"
  :title="'标题'"
  theme="default"
  show-title-close
  :close-button-text="'确定'"
></fe-key-board>

API

Events