vue2 directive input限制小数点位数，及更新v-model

Stavin Li

已于 2022-06-06 10:19:03 修改

阅读量2.2k

点赞数 2

分类专栏： vue 文章标签： vue.js elementui javascript

于 2019-08-29 13:46:33 首次发布

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/m0_37285193/article/details/100136142

版权

vue 专栏收录该内容

27 篇文章 4 订阅

订阅专栏

<input type="text" v-model.lazy="phone" v-enter-number="0"> //无小数点
<input type="text" v-model.lazy="phone" v-enter-number> //保留两位小数点


Vue.directive('enterNumber', {
    bind: function(el, { value = 2 }) {
        el = el.nodeName == "INPUT" ? el : el.children[0]
        var RegStr = value == 0 ? `^[\\+\\-]?\\d+\\d{0,0}` : `^[\\+\\-]?\\d+\\.?\\d{0,${value}}`;
        el.addEventListener('keyup', function() {
            el.value = el.value.match(new RegExp(RegStr, 'g'));
            el.dispatchEvent(new Event('input'))
        })
    }
})