el-input类型为number时禁止输入e和.

1,679 阅读1分钟
<el-form-item label="一级渠道码" prop="first_channel_code"> 
    <el-input type="number" v-model.number="ruleForm.first_channel_code" @keydown.native="channelInputLimit"></el-input> 
</el-form-item>

// bug fix:指定输入类型为number时仍然可以输入字母'e'和小数点'.'(因为也属于数字类型的范围),这里做一下输入限制 

channelInputLimit (e) { 
    let key = e.key // 不允许输入'e''.' 
    if (key === 'e' || key === '.' || key==='+' || key==='-0') 
    { 
        e.returnValue = false return false 
    } 
    return true 
}

App.vue

/* // 处理input type = number的上下箭头 */ 

input::-webkit-outer-spin-button, 
input::-webkit-inner-spin-button {   
    -webkit-appearance: none; 
    } 
input[type='number'] {   
    -moz-appearance: textfield; 
   }