el-input 保留两位小数 自定义指令

记录一下 自定义指令

 后续优化了一下，现在保留2位小数，并传递需要保留的位数， 不传递默认保留9位小数

export default {
    bind(el, binding, vnode) {
        const numberLength = binding.value || 9
        vnode.componentInstance.$watch('value', function (newValue,oldValue) {
            const index = newValue.indexOf(".");
            // 保留两位
            if (index != -1) {
                const value = newValue.slice(0, index + 3);
                vnode.componentInstance.$emit('input', value)
            }
            const numberLengthArr = [1]
            for(let n = 1; n <= numberLength ; n++){
                numberLengthArr.push(0)
            }
            if(newValue >= +numberLengthArr.join('')) node.componentInstance.$emit('input', oldValue)
        })
    }
}

使用方法

<!-- 保留两位小数，并保留三位数 -->
<el-input
    v-keepTwoBits="3"
    placeholder="请输入费用"
    v-model="steps1Form.policyFee"
    type="number"
></el-input>

<!-- 保留两位小数，并保留久位数 默认 -->
<el-input
    v-keepTwoBits
    placeholder="请输入保费合计"
    v-model="steps1Form.policyFee"
    type="number"
></el-input>