vant组件 NumberKeyboard 组件中的双向绑定弹出键盘bug

vant 组件中的 NumberKeyboard在运用到移动端时，IOS和Android都会出现bug,感觉是个巨坑。

一、bug情况

IOS：输入数字会出现延迟卡顿的情况，我开始以为是IOS未引入fastclick的问题，但引入后问题并未解决

Android:输入数字后，会将上一个输入的数字清除，再将这次输入数字显示，也就是每次只能显示当前输入的数字

二、解决办法

自己写一套键盘和样式

html部分
 <transition name="keyBroad-transform" mode="out-in">
      <ul class="numKeyBroad" v-if="isShowKeyBroad">
        <li @click="ceshicb('1')">1</li>
        <li @click="ceshicb('2')">2</li>
        <li @click="ceshicb('3')">3</li>
        <li @click="ceshicb('4')">4</li>
        <li @click="ceshicb('5')">5</li>
        <li @click="ceshicb('6')">6</li>
        <li @click="ceshicb('7')">7</li>
        <li @click="ceshicb('8')">8</li>
        <li @click="ceshicb('9')">9</li>
        <li @click="ceshicb('.')" class="dot">.</li>
        <li @click="ceshicb('0')">0</li>
        <li class="delText" @click="delText">删除</li>
      </ul>
    </transition>``

css部分

  .keyBroad-transform-leave-active,
  .keyBroad-transform-enter-active {
    transition: all .3s;
  }
  .keyBroad-transform-enter {
    opacity: 0;
    transform: translateY(30px);
  }
  .keyBroad-transform-leave-to {
    opacity: 0;
    transform: translateY(30px);
  }

.numKeyBroad {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-wrap: wrap;
  li { 
    width: 32%;
    height: 54px;
    font-size: 24px;
    font-style: normal; 
    line-height: 54px;
    text-align: center;
    vertical-align: middle;
    border: 0 solid #f7f7f7;
    border-width: 1px 1px 0 0; 
    background-color: #fff;
    flex: 1 0 auto;
  }
  li:active {
    background-color: #f2f3f5;
  }
  .delText {
    background-color: #ebedf0;
    font-size: 16px;
  }
  .dot {
    background-color: #ebedf0;
  }
}