脚本宝典收集整理的这篇文章主要介绍了uniapp如何将输入值转成大写,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
uniapp将输入值转成大写的方法:首先过滤不需要的字符,只保留数字和字母;然后通过“if (!/^[A-Z\d]+$/.test(val)) {...}”方式将字符小写转为大写;最后通过return输出值即可。
本教程操作环境: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 } } },
以上就是uniapp如何将输入值转成大写的详细内容,更多请关注脚本宝典其它相关文章!
以上是脚本宝典为你收集整理的uniapp如何将输入值转成大写全部内容,希望文章能够帮你解决uniapp如何将输入值转成大写所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。