支撑

• 弹出数字键盘
• 小数点前自定义最多输入几位（默许11位）
• 小数点后自定义最多输入几位（默许4位）
• 假如设置小数点后为0位，则不许可输入小数点
• 处理IOS弹出体系键盘收起后，页面不恢复

<template>
  <input
    ref="number"
    @input="input"
    :placeholder="placeholder"
    :value="value"
    @blur="blur"
    type="number">
</template>
<script>

export default {
  props: {
    value: { // 设置值
      default: '',
      type: null
    },
    integerDigits: { // 小数点前几位
      default: 11,
      type: Number
    },
    decimalDigits: { // 小数点后几位
      default: 4,
      type: Number
    },
    placeholder: { // 设置默许值
      default: '',
      type: String
    }
  },
  data () {
    return {
      oldValue: this.value,
      isDel: false, // 是不是是删除操纵
      isDot: false // 是不是是小数点输入操纵
    }
  },
  computed: {
  },
  components: {
  },
  created () {

  },
  methods: {
    input (event) {
      this.isDel = false
      this.isDot = false
      if (event.data === null) this.isDel = true
      if (event.data === '.') this.isDot = true

      let reg
      if (this.decimalDigits > 0) {
        reg = new RegExp(`(?!^0\\d)^(\\d{1,${this.integerDigits}}(\\.\\d{0,${this.decimalDigits}})?)?$`, 'g')
      } else {
        reg = new RegExp(`(?!^0\\d)^(\\d{1,${this.integerDigits}})?$`, 'g')
      }

      if (reg.test(event.target.value)) {
        if (event.target.value !== '' || this.isDel) { // 假如不是由于退却，让值变空，就不转变旧值
          this.oldValue = event.target.value
        }
      }
      if (this.isDot) {
        if ((event.target.value && /\./g.test(event.target.value)) || this.decimalDigits === 0) {
          event.target.value = null // 过剩的.强迫革新
        }
      }
      event.target.value = this.oldValue
      this.$emit('input', this.oldValue)
    },
    blur () {
      this.resolveBug()
    },
    resolveBug(){
      clearTimeout(this.timer)
      this.timer=setTimeout(function(){
        if(document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA'){
          return
        }
        let result = 'pc';
        if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { // 推断iPhone|iPad|iPod|iOS
          result = 'ios'
        }else if(/(Android)/i.test(navigator.userAgent)) {  // 推断Android
          result = 'android'
        }
        if(result === 'ios' ){
          document.activeElement.scrollIntoViewIfNeeded(true);
        }
      },10)
    }
  }
}
</script>

<style scoped>
</style>

运用体式格局

<NumberInput
   :integerDigits="4"
   :decimalDigits="2"
   class="input"
   v-model="value"/>

处理点：

• 不许可输入类似于 “0666”, “0006”
• 不许可输入过剩的 “.”, 如输入 “3.02.”

备注：假如对你有协助，请帮助点个赞