vue 中的input

1. 限制小数位数

1.1 Vue 限制input输入 小数点后两位number

keydownFn(event) {
    // 通过正则过滤小数点后两位
    // event.target.value = (event.target.value.match(/^\d*(\.?\d{0,1})/g)[0]) || null    //只能为正数
       event.target.value = (event.target.value.match(/\-?\d+\.?\d{0,1}/g)[0]) || null       //可以为负数
    
},

1.2 Vue 限制input输入 小数点后一位number

keydownFn(event){
    const arr = event.target.value.split('.');
    if(arr.length == 2 && arr[1].length > 1){       //有至少两位小数
        event.target.value = arr[0] + '.' + arr[1].substr(0,1);
        this.$message({
            message: '只允许一位小数',
            type: 'warning'
        });
     }else if(arr.length == 1){      //没有小数
        event.target.value = arr[0]
     }else if(arr.length == 2 && arr[1].length == 1){        //只有一位小数
        event.target.value = arr[0] + '.' + arr[1];
     }
},

2. 监听 oninput 事件无效（oninput 即 input的输入值变化事件）

2.1 常规写法 ===>> 无效； v-on:oninput也没有用

2.2 vue中的正确写法（v-on亦可）

3. 如果使用了UI框架，其input组件是否有 oninput / keydown 事件，需要看其框架中是否有定义（一般文档中有）。如果文档中没有，用了之后可能会没有用（当然，可以用 .native 修饰符试一试哦） ===>> 比如 Element

 

文章仅为本人学习过程的一个记录，仅供参考，如有问题，欢迎指出！