首页 > 互联资讯 > 技术交流  > 

vue限制输入数字或者保留两位小数实现

目录
  • 正文
  • vant 的安装
  • 两种方法
    • 原生方法使用
    • vant使用方法

正文

项目使用vant框架

vant 的安装

项目中使用vant时,可以通过npm或yarn进行安装。vue2和vue3安装方法基本相同

npm i vant -S # 安装最新版
npm i vant@latest-v2 -S # vue2项目,安装vant2

通过CDN安装 样式文件、js文件


或者

 

两种方法

原生方法使用

加上inputmode属性解决ios端调起带小数点的数字键盘问题


vant使用方法

允许输入数字,调起带符号的纯数字键盘

限制保留两位小数方法

handlePrice(val){
                if (val !== '' && val.substr(0, 1) === '.') {
                    val = "";
                }
                val = val.replace(/^0*(0.|[1-9])/, '$1');//解决 粘贴不生效
                val = val.replace(/[^d.]/g, "");  //清除“数字”和“.”以外的字符
                val = val.replace(/.{2,}/g, "."); //只保留第一个. 清除多余的
                val = val.replace(".", "$#$").replace(/./g, "").replace("$#$", ".");
                val = val.replace(/^(-)*(d+).(dd).*$/, '$1$2.$3');//只能输入两个小数
                if (val.indexOf(".") < 0 && val !== "") {
                    if (val.substr(0, 1) === '0' && val.length === 2) {
                        val = val.substr(1, val.length);
                    }
                }
                this.priceAll = this.priceOne = val;
            },

以上就是vue限制输入数字或者保留两位小数实现的详细内容,更多关于vue限制输入的资料请关注讯客其它相关文章!

vue限制输入数字或者保留两位小数实现由讯客互联技术交流栏目发布,感谢您对讯客互联的认可,以及对我们原创作品以及文章的青睐,非常欢迎各位朋友分享到个人网站或者朋友圈,但转载请说明文章出处“vue限制输入数字或者保留两位小数实现