vue自定义指令封装(el-input框只能输入正整数)

1.main.js 中添加如下代码

复制代码
Vue.directive('enterNumber', {
  inserted: function (el) {
    el.addEventListener("keypress",function(e){
      e = e || window.event;
      let charcode = typeof e.charCode == 'number' ? e.charCode : e.keyCode;
      let re = /\d/;
      if(charcode == 46){
        if(el.value.includes('.')){
          e.preventDefault();
        }
        return;
      }else if(!re.test(String.fromCharCode(charcode)) && charcode > 9 && !e.ctrlKey){
        if(e.preventDefault){
          e.preventDefault();
        }else{
            e.returnValue = false;
        }
      }
    });
  }
});

2.页面使用

main.js中的name 以-连接 并且前面加上v-

相关推荐
NEXT0614 小时前
普通函数与箭头函数的区别
前端·javascript·面试
全马必破三15 小时前
Webpack知识点汇总
前端·webpack·node.js
NEXT0615 小时前
CommonJS 与 ES Modules的区别
前端·面试·node.js
TechFind15 小时前
如何为 AI Agent 写出完美的 SOUL.md 人格文件(2026指南)
javascript
猪头男15 小时前
【从零开始学习Vue|第八篇】深入组件——组件事件
前端
薛一半15 小时前
React三大属性之refs
前端·javascript·react.js
Lao乾妈官方认证唯一女友:D15 小时前
Ethers.js使用方法
javascript·web3
程序员林北北15 小时前
【前端进阶之旅】Svelte:编译即框架,让前端开发回归简洁
前端·javascript·vue.js·react.js·html5
yy.y--16 小时前
Java线程实现浏览器实时时钟
java·linux·开发语言·前端·python
echoVic16 小时前
给 Agent Skill 装上「黑匣子」:STOP 可观测性协议设计与实现
java·javascript