vue指令只能输入正数并且只能输入一个小数点的方法
时间:2019-04-17
本文章向大家介绍vue指令只能输入正数并且只能输入一个小数点的方法,主要包括vue指令只能输入正数并且只能输入一个小数点的方法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
最近在做一个金额查询,验证的时候总是出现很多问题,如输入-号后,input框里是没有了,但是在model里还是绑定了,提交的时候就会报错,真的是让人很是郁闷,小数点也是input框过滤掉了,但是提交的时候也会出现。不过经过努力终于找到了一种解决方案,在这里``和大家分享一下下。
Vue.directive('numbers', { bind: function (el, binding) { console.log('ere') }, inserted: function (el) { // el.querySelector('input').blur(console.log('etset')) }, update: function (el, binding, vnode, oldVnode) { console.log('vnode', vnode) let express = vnode.data.directives[1].expression // let value = el.querySelector('input').value let value = vnode.data.directives[1].value if (typeof value === 'string') {} //在重置的时候清空 if (value.split('.').length - 1 > 1) { value = value.replace(/\.{2,}/g, '') // 只保留第一个. 清除多余的 value = value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.') } let repeatValue = value.replace(/[^\d.]/g, '') // setTimeout(() => { // el.querySelector('input').value = repeatValue // }, 5) setValueWithExpressionVue(vnode.context.$data, express, repeatValue) }, componentUpdated: function () {}, unbind: function (el) {} }) // function setValueWithExpressionVue (currObj, expression, value) { expression = expression.split('.') expression.forEach(function (arg, i) { if (i < expression.length - 1) { currObj = currObj[arg] } else { currObj[arg] = value } }) }
放到main.js里就好了
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
- WCF技术剖析之二十六:如何导出WCF服务的元数据(Metadata)[扩展篇]
- 如何解决打开VS2010后没有UI界面的问题
- RadRails1.0降临——增加Profiler、CallGraph Analyzer和Rails Shell等新特性
- Rails存储库从SVN转向Git
- 报告称10后已变成出境游“老司机”屌丝80后:我还没出过国
- 担心人工智能取代你的工作?听听微软科学家怎么说!
- Radiant: 基于Ruby on Rails的内容管理系统
- “大数据”如何追回1.3亿元税款?
- Enterprise Library深入解析与灵活应用(5):创建一个简易版的批处理执行器,认识Enterprise Library典型的配置方式和对象创建方式
- BTC.com时讯-IBM等老牌大企业因区块链技术获得新活力
- Kit 3D 更新
- Enterprise Library深入解析与灵活应用(5):创建一个简易版的批处理执行器,认识Enterprise Library典型的配置方式和对象创建方式
- 晚上好啊!这是今天人工智能精选要闻
- 构建Flex应用的10大误区
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法