Vue自定义指令实现input限制输入正整数
2024-09-01 01:14:11
directive.js
import Vue from 'vue'
export default () => {
Vue.directive('Int', {
inserted: function (el) {
console.log(el);
el.addEventListener("keypress",function(e){
console.log(e)
e = e || window.event;
let charcode = typeof e.charCode == 'number' ? e.charCode : e.keyCode;
let re = /\d/;
if(!re.test(String.fromCharCode(charcode)) && charcode > && !e.ctrlKey){
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
}
});
}
});
}
在main.js 全局引入
import Directive from './directive'
Vue.use(Directive);
使用
<td>
<input type="tel" v-model.number="itemEight.droopValue" class="input" v-Int maxlength="" />
</td>
最新文章
- jS正则和WEB框架Django的入门
- span 元素无法设置宽度问题
- js实现当前导航菜单高亮显示
- php图片处理类库 Image
- 实现在Android 下log的使用总结
- DuiLib学习笔记(二) 扩展CScrollbar属性
- Google Code Jam 2010 Round 1B Problem B. Picking Up Chicks
- hadoop环境安装及简单Map-Reduce示例
- [又是BUG]常见的RuntimeException
- C#_会员管理系统:开发四(日志查看)
- 使用(Drawable)资源——图片资源
- Linux下的进程与线程(二)—— 信号
- 使用Vertx重构系统小结
- Python 3 函数自由变量的大坑
- 安装Mosquitto学习MOTT协议
- loj 10050 连续子段最大异或和
- JAVA设计模式详解(四)----------单例模式
- linux arm的高端内存映射
- Python: ord()函数
- 基于HttpClient JSONObject与JSONArray的使用