element ui form 表单出现英文提示的解决方案

场景再现:

在使用 form 表单的时候,一般都需要对表单元素进行验证,错误就出现在了这里,除了配置的错误信息,还会出现一个 英文校验提示,如下图:

解决方案

出现的原因是在el-form-item中使用了required属性,同时又用rules自定义了表单验证规则。

这时候如果需要设置必填项,此时的 require 需要配置在 el-input 中,或者直接配置在 rule 中。

// 错误示例,required 定义在了 el-form-item
<el-form-item
  label="名称"
   prop="name"
   required
 >
   <el-input
     v-model="form.menuName"
     :placeholder="'请输入名称'"
     maxlength="30"
   />
 </el-form-item>

// 正确写法,写在 el-input中
<el-form-item
  label="名称"
   prop="name"
 >
   <el-input
     v-model="form.menuName"
     :placeholder="'请输入名称'"
     maxlength="30"
     required
   />
 </el-form-item>

或者在 rule 中配置:

rules: [
	menuName: [{ required: true, validator: validateMenuName, trigger: "blur" }],
]
相关推荐
^^为欢几何^^4 分钟前
lodash中_.difference如何过滤数组
javascript·数据结构·算法
Hello-Mr.Wang8 分钟前
vue3中开发引导页的方法
开发语言·前端·javascript
程序员凡尘36 分钟前
完美解决 Array 方法 (map/filter/reduce) 不按预期工作 的正确解决方法,亲测有效!!!
前端·javascript·vue.js
北岛寒沫5 小时前
JavaScript(JS)学习笔记 1(简单介绍 注释和输入输出语句 变量 数据类型 运算符 流程控制 数组)
javascript·笔记·学习
everyStudy5 小时前
JavaScript如何判断输入的是空格
开发语言·javascript·ecmascript
无心使然云中漫步6 小时前
GIS OGC之WMTS地图服务,通过Capabilities XML描述文档,获取matrixIds,origin,计算resolutions
前端·javascript
Bug缔造者6 小时前
Element-ui el-table 全局表格排序
前端·javascript·vue.js
xnian_7 小时前
解决ruoyi-vue-pro-master框架引入报错,启动报错问题
前端·javascript·vue.js
罗政7 小时前
[附源码]超简洁个人博客网站搭建+SpringBoot+Vue前后端分离
vue.js·spring boot·后端
麒麟而非淇淋8 小时前
AJAX 入门 day1
前端·javascript·ajax