美文网首页vue
el-input纯文字输入

el-input纯文字输入

作者: 明天_8c66 | 来源:发表于2021-09-16 13:45 被阅读0次

    template

    <template>
          {{form.input}}
          <el-input placeholder="请输入密码" v-model="form.input" @input="handleNumberInput($event, form, 'input')"></el-input>
        </template>
    

    data

    form: {
              input: ''
            }
    

    methods

    handleNumberInput(value, data, key) {
            console.log(value, data, key)
            data[key] = value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')
            // this.$set(this.form, key, data[key])
          },
    

    金额输入框数字校验

    <el-input v-model="amount" placeholder="请输入金额" oninput="value=value.match(/^\d+(?:\.\d{0,2})?/)"></el-input>
    
    <el-input v-model="values" placeholder="请输入数字" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
    

    输入框千分化

    <el-input
                        :disabled="isView"
                        v-model="billHexiaoFormList.incomeMoney"
                        oninput="value=value.match(/^\d{1,13}(?:\.\d{0,2})?/)"
                        style="width:70%"
                        @focus="$delcommafy(billHexiaoFormList, 'incomeMoney')"
                        @blur="$comdify(billHexiaoFormList, 'incomeMoney')" />
    
    function comdify(obj, name) { // 加千分位
      const n = obj[name] + ''
      if (!n) return n
      const str = n.split('.')
      const re = /\d{1,3}(?=(\d{3})+$)/g
      const n1 = str[0].replace(re, '$&,')
      obj[name] = str.length > 1 && str[1] ? `${n1}.${str[1]}` : `${n1}.00`
      return str.length > 1 && str[1] ? `${n1}.${str[1]}` : `${n1}.00`
    }
    
    function delcommafy(obj, name) { // 去掉千分位
      let num = obj[name]
      if (!num) return num
      num = num.toString()
      num = num.replace(/,/gi, '')
      num = num.replace(/.00$/i, '')
      // this.houseRegulationAddForm.agreementMoneyAddForm[name] = num
      obj[name] = num
      return num
    }
    

    相关文章

      网友评论

        本文标题:el-input纯文字输入

        本文链接:https://www.haomeiwen.com/subject/swprgltx.html