https://codepen.io/maiyaoqiang/pen/rNmVNXa?editors=1010
已兼容vue3.0
npm install vue-input-directive --save
import Vue from 'vue'
import inputValidate from 'vue-input-directive'
Vue.use(inputValidate)
输入数字限制最大值
<el-input v-d-input-max="99.99" v-model="value"></el-input>
只能输入正整数
<el-input v-d-input-int v-model="value"></el-input>
最多只能输入两位小数
<el-input v-d-input-point2 v-model="value"></el-input>
只能输入英文
<el-input v-d-input-en v-model="value"></el-input>
限制正则内容,输入时若正则部分匹配,则把匹配的部分留下,其余清空 实际上上面4种除了输入两位小数以外其他3个都可以用正则替代
<!-- 限制不能输入中文 -->
<el-input v-d-input-regexp="/((?![\u4E00-\u9FA5]).)*/" v-model="value"></el-input>
<!-- 限制仅可输入数字字母 -->
<el-input v-d-input-regexp="/[0-9A-Za-z]*/" v-model="value"></el-input>
<!-- 限制输入两位小数 最大可输入99.99 -->
<el-input
v-d-input-point2
v-d-input-max="99.99"
v-model="value"></el-input>
只能输入数字和字母和中文
import Vue from 'vue'
import {DInitFun} from 'vue-input-directive'
// 只能输入数字和字母
Vue.directive(
'd-input-num-en',
DInitFun((ele, binding) => {
let value = ele.value + ''
const reg = /[a-zA-Z0-9\u4E00-\u9FA5]*/
const matchRes = value.match(reg)
if (matchRes) {
value = matchRes[0]
} else {
value = ''
}
ele.value = value
})
)