uniapp 如何将输入值转成大写

网络安全侠
• 阅读 981
uniapp 将输入值转成大写的方法:首先过滤不需要的字符,只保留数字和字母;然后通过 “if (!/^[A-Z\d]+$/.test (val)) {...}” 方式将字符小写转为大写;最后通过 return 输出值即可。

uniapp 如何将输入值转成大写

本教程操作环境:windows7 系统、uni-app v3 版本,该方法适用于所有品牌电脑。

推荐(免费):uni-app 开发教程

uni-app 监听 input 输入,小写变成大写,并且过滤掉不想要的字符

在做 input 输入过滤监听的时候,用 watch 监听改变值,界面上的值会雷打不动的不按照你的思维变化,以下监听只是一个示例,需要其他过滤字符的,需要修改正则表达式。

这里提供,监听输入的时候,只能是数字和字母,并且小写字母要变为大写字母。不废话,直接上代码:

输入框准备完毕,因为要自己监听输入,因此把 v-model 拆分使用,input 的方法是重点

<input type="text" placeholder="请输入17位VIN码(必填)" maxlength="17" @input="vinInput" :value="formData.vin" />

过滤方法

// 过滤vin输入

vinInput(e) {

let val = e.detail.value;

if (/[^a-zA-Z0-9]/g.test(val)) { // 先过滤不需要的字符,只保留数字和字母

val = val.replace(/[^a-zA-Z0-9]/g, '');

}

if (!/^[A-Z\d]+$/.test(val)) {// 再进行转换,小写转为大写

val = val.toUpperCase();

}

this.formData.vin = val; //这里对应的是value绑定的变量

return val; // 最后输出值,要保证输入框的值和value绑定的值一致

},

因为我这里在完成输入过滤之后,还会进行其他操作,因为还需要在 watch 里面再次监听 formData.vin 这个变量。

可能有小伙伴疑问,为啥不直接在上述的 vinInput 方法直接操作,那是因为 input 只能监听到输入,但是如果你是其他方式把数据填充进来的,那就没办法进行相应的操作了。

watch: {

'formData.vin'(val) {

this.vinCheck = null; 

// 如果有17位,则开始请求后台,带出数据

if (val.length == 17) {

// do something

}

}

},

源码附件已经打包好上传到百度云了,大家自行下载即可~

链接: https://pan.baidu.com/s/14G-b...
提取码: yu27
百度云链接不稳定,随时可能会失效,大家抓紧保存哈。

如果百度云链接失效了的话,请留言告诉我,我看到后会及时更新~

开源地址
码云地址:
http://github.crmeb.net/u/defu

Github 地址:
http://github.crmeb.net/u/defu

点赞
收藏
评论区
推荐文章
Easter79 Easter79
4年前
vue 如何将输入框的输入自动小写转大写(使用 v
前言:小写转大写,可以用过滤器实现,但当使用vmodel时就不行了,这里有解决方案。转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9289205.html网站地址:我的个人vueelementuidemo网站(https://www.oschina.net/action/GoToLink
Easter79 Easter79
4年前
str的用法
  字符串的索引切片以及常用的操作方法都是形成新的字符串,和原字符串没有关系 切片和索引\按照索引取值按照切片取值,顾头不顾尾,切片加步长 只要倒叙取值就要加上反向步长capitalize() 首字母大写\center() 将字符串居中可以添加填充物\swapcase() 大小写反转
Javascript将小写字母转为大写的方法
题目:将:“America”、“Greece”、“Britain”、“Canada”、“China”、“Egypt”各个字符串统一改为大写toUpperCase()方法用于把字符串转换为大写。language<!DOCT
Wesley13 Wesley13
4年前
MongoDB的数据类型
一.MongoDB之丰富多彩的数据类型世界首先我们要先了解一下MongoDB中有什么样的数据类型:Object ID:Documents自生成的\_idString:字符串,必须是utf8Boolean:布尔值,true或者false(这里有坑哦~在我们大Python中TrueFalse首字母大写)Integer
Stella981 Stella981
4年前
C#在与java对接时候的UrlEncode的坑
最近与建行接口做对接和与一家短信运营商做对接时候遇到了这个坑在java中对UrlEncode时候哪些url非安全字符被转为%数字和大写字幕组合,比如:zhangsan/d会被转为 zhangsan%2Fd ,而在C中确被转为 zhangsan%2fd 。注意大小写的差异然后就导致了各种加密验签无法通过的情况。于是就自己在C原来的Url
Stella981 Stella981
4年前
Mongodb之数据类型
一.MongoDB的数据类型Object ID:Documents自生成的\_idString:字符串,必须是utf8Boolean:布尔值,true或者false(Python中TrueFalse首字母大写)Integer:整数(Int32Int64你们就知道有个Int就行了,一般我
Wesley13 Wesley13
4年前
C语言概述
C语言基本语法单位字符集字符是高级语言中的最小单位,是构成语法单位的基础。C语言中规定可以使用的合法字符的集合为C字符集C字符集采用ASCII码字符集C语言字符集由下列字符组成(1)字母和数字字符。(小写字母a~z、大写字母A~Z、数字0~9)(2)不可打印的字符。(空格符、回车符、换行符、控
Wesley13 Wesley13
4年前
oracle函数
单行函数SQL字符函数SQLselectlower('HelloWorld')转小写,upper('HelloWorld')转大写,initcap('helloworld')首字母大写 2 fromdual;转小写   转大写   首字母大写             
Wesley13 Wesley13
4年前
125. 验证回文串
\TOC\题目给定一个字符串,验证它是否是回文串,只考虑字母和数字字符,可以忽略字母的大小写。说明:本题中,我们将空字符串定义为有效的回文串。示例1:输入:"Aman,aplan,acanal:Panama"输出:true示例2:输入:"raceacar"输出
Stella981 Stella981
4年前
Leetcode 424.替换后的最长重复字符
替换后的最长重复字符给你一个仅由大写英文字母组成的字符串,你可以将任意位置上的字符替换成另外的字符,总共可最多替换 _k_次。在执行上述操作后,找到包含重复字母的最长子串的长度。注意:字符串长度和_k_不会超过 104。示例1:输入:s"ABAB",k2输
Stella981 Stella981
4年前
Scala_标识符
用于对象,类,变量和方法的名称称为标识符。关键字不能用作标识符,标识符区分大小写。类名首字母大写方法名称第一个字母小写程序文件名应该与对象名称完全匹配1.字母数字标识符以字母或下划线开头,后跟字母、数字或下划线。$字符是Scala中的保留关键字,不应在标识符中使用2.运算符标识符由一个或