vue elementui自定义校验不能输入汉字

最新推荐文章于 2024-08-26 17:20:42 发布

super_lhc

最新推荐文章于 2024-08-26 17:20:42 发布

阅读量3.8k

点赞数 4

文章标签： vue.js

本文链接：https://blog.csdn.net/super_lhc/article/details/116753966

版权

本文介绍了在Vue.js结合ElementUI的表单中如何实现自定义校验规则，防止用户输入汉字。通过在需要验证的字段设置`:rules`属性，并在`data`中定义相应的自定义验证条件，可以实现特定的验证功能。

摘要由CSDN通过智能技术生成

先在需要验证的地方添加验证规则:

:rules=“rules”

<el-form
        ref="form"
        label-width="100px"
        :model="form"

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

super_lhc

关注关注

4
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

vue表单自定义校验规则

Taozi_1379的博客

03-21

1400

element 表单校验邮箱，中文名 prop要和rule名称一致，check是通过正则表达校验 data() { let checkEmail = (rule, value, cb) => { let regEmail = /^([a-z])+[0-9]/; // 字母开头+数字 if (regEmail.test(value)) { return cb(); }

vue elementui 中带字数校验的 textarea组件封装

connie_1990的博客

07-22

2659

在form表单中经常会遇到带字数校验的textarea需求，具体效果如下图所示，实现的功能如下：右下角有最大的字数限制实时计算文本框内输入的字数在超过最大字数时自动截断下面我们看一下，希望存在一个如下控件可以供我们使用 <el-form-item label="其它反馈意见:" prop="others"> <text-area v-model="form.others" :max-length="maxLength" :rows="3"/>

参与评论您还未登录，请先登录后发表或查看评论

javascript 表单验证禁止输入中文汉字

04-26

javascript 表单验证禁止输入中文汉字

Web前端之Vue+Element的form表单实现禁止输入汉字、即使输入也替换为空字符串、中文、路径、链接、地址

CSDN博客主页地址：https://mengjian.blog.csdn.net/

09-30

3153

Web前端之Vue+Element的form表单实现禁止输入汉字、即使输入也替换为空字符串、中文、路径、链接、地址

VUE中设置只输入数字和小数点，中文和英文不可输入

最新发布

xiao_166711的博客

08-26

210

设置小数点时遇到一个坑，我这边的浏览器在正则表达式设置只允许输入一个小数点时，识别不了相应的代码，所以只能设置允许输入小数点。希望有大佬指点一下，怎么改成只允许输入一个小数点。

正则表达式验证不能输入汉字 element form

一个天秤座的程序猿????

02-17

5467

这个比较简单，不啰嗦直接上代码~ ** /[\u4E00-\u9FA5]/g ** <el-form-item label="element表单" prop="form" :rules="[ { required: true, message: '不能为空'}, { validator: checkData, trigger: 'b...

element-ui input输入框，校验不能输入中文和特殊字符，输入中文后，英文输不进去的问题

m0_66899315的博客

04-29

3240

element-ui input输入框，校验不能输入中文和特殊字符，输入中文后，英文输不进去的问题，以及特殊字符校验

element ui 表单验证规则demo：不能中英文混杂！不能有标点符号！

南北极之间

12-31

754

正则： /^([\u4e00-\u9fa50-9]+|[A-Za-z0-9]+)$/g data() { let checkWords = (rule, value, callback) => { console.log(value) if (value === '') { this.$message.warning('关键词不能为空！') return callback(new Error('关键词不能为空！')) .

一篇解决Element ui密码框眼睛图标明文密文，不允许中文输入以及输入的各种校验

请告诉他

01-29

3303

先上效果，再上代码，后面有说明 HTML <el-form-item label="新密码" prop="cpPassword" style="margin-left: 13px;"> <el-input v-model="supplierEx.cpPassword" :type="pwdType2" placeholder="请输入密码" @keyup.enter.native="login"> <i slot...

vue elementUI 表单校验的实现代码（多层嵌套）

10-16

在这里，我们为姓名字段设置了两个校验规则：一个是不能为空，另一个是只能包含中文字符。密码字段除了不能为空外，还增加了一个自定义校验函数`Verify.validatePassword`。用户电话号码字段则简单地要求不能为空。 ...

vue+element中自定义表单校验特殊字符

生如夏花炫至茶靡

09-22

9793

本次项目基于vue和element-ui，需要在前端用户输入的时候去校验输入的内容中是否含有特殊符号，如果有，则提示用户不支持输入特殊符号。校验规则方法 export function checkSpecificKey(str) { var specialKey = "[`~!#$^&*()=|{}':;',\\[\\].<>/?~！#￥……&*（）——|{}...

vue校验输入框不能有中文

weixin_50188421的博客

07-30

2807

vue实现表单填写输入框校验不能包含中文目标：form表单内对编码进行校验在el-form-item标签里“定义”，注意一定要加上 :rules=“rules” <el-form :inline="true" :model="formInline" label-width="120px" :rules="rules" ref="formInline"> <el-form-item label="编码：" prop="SppiCode" >

vue3+elementPlus el-input禁止输入中文

liuzaixi的博客

03-22

1352

这种写法会自动去掉输入的中文，如果是其他规则，可以将正则替换成自己需要的就可以。这里有比较常用的正则，可以作为参考。

Element UI 中文英文混合字符长度校验

qq_42941302的博客

01-15

3157

场景当我们需要使用 element-ui 来校验长度的时候，可以在前端用其内置的 max、min 属性来限制。但是我们知道——由于数据库的编码格式的不同，一个汉字在数据库中需要占 2-3 个字节。假如有一个 name 字段，数据库中设置的长度为64。在 element-ui 中如果用 max:64 的方法对字段进行限制，那么输入64个汉字时，数据库中实际的长度就是 192 ，这显然不是我们想要的。所以，我们需要自定义一个函数，可以满足中英文字符的混合校验，精准地对字段的长度进行限制。实现 const

前端输入框校验限制不能输入中文

weixin_59527403的博客

02-23

816

前端输入框校验限制不能输入中文

Element UI el-input 标签，正则表达式限制输入框内容（中文，英文，邮箱，手机号）

qq_33235680的博客

11-24

6808

Element UI el-input 标签，正则表达式限制输入框内容（中文，英文，邮箱，手机号）

elementUI表单验证没有反应

PUBGA的博客

10-08

3315

项目当中出现点击按钮进行表单校验没有反应(既没有校验失败也没有校验成功) 出现此类问题首先检查是否使用了element的自定义校验如果使用了自定义校验无论验证成功或失败,都必须要返回一个callback() // 自定义校验社保 var validateSocialBase = (rule, value, callback) => { if (value < this.formData.socialMin) { callback(new Error(`社保

vue element-ui的form表单校验总结，动态校验、自定义校验（用正则校验手机号码、数字、url、中文）

TangMonk的博客

09-14

2872

data() {return {//在rules属性填写相关字段的校验规则rules: {{ required: true, message: "必填" },{ min: 6, max: 18, message: '长度在 6 到 18 个字符', trigger: 'blur' }],email:[{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'change' }],//自定义校验name:[

vue中表单自定义校验不能出现中文字符

09-01

在Vue中，表单自定义校验不能出现中文字符，原因是因为Vue使用的是JavaScript语言，而JavaScript默认使用的是Unicode字符集。Unicode字符集包含了全世界几乎所有的字符，包括中文字符。但是，JavaScript的正则表达式...