解决element ui,v18n切换语言时,表单验证自动触发问题

weixin_44043566

于 2024-03-22 16:20:13 发布

阅读量434

点赞数 3

文章标签： ui vue.js javascript

本文链接：https://blog.youkuaiyun.com/weixin_44043566/article/details/136944748

版权

本文介绍了如何在ElementUI的el-form组件中，将validate-on-rule-change选项设为false，以防止在规则变化时立即进行验证，提供更灵活的用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

设置el-form表单的validate-on-rule-change选项为false。

   <el-form
        ref="loginFormRef"
        :rules="loginRules"
        :model="loginForm"
        :validate-on-rule-change="false"
      >
     
       
   </el-form>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_44043566

关注关注

3
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

最全面鸿蒙系统开发的相关资料收录

Wscats

07-31

4885

开发本示例基于 OpenHarmony 下的 JavaScript UI 框架，进行项目目录解读，JS FA、常用和自定义组件、用户交互、JS 动画的实现，通过本示例可以基本了解和学习到 JavaScript UI 的开发模式。本项目是基于 OpenHarmony 项目而不是 HarmonyOS 项目，请注意运行环境。请参考 OpenHarmony 项目配置方法进行项目配置和运行。如果你不熟悉 OpenHarmony 的 JS 开发，请参考该项目的开发讲解。示例下载 awesome-har

Element UI打开表单自动验证问题的解决

10-18

1542

页面一打开什么都没做表单就自动验证的解决方法

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

解决element ui切换语言时,表单验证自动触发

weixin_44373861的博客

07-01

1519

项目国际化处理。一切换中英文，表单的验证就自动触发，一片红，影响观感。像这样：可以在watch中监听语言变化 watch:{ //处理切换语言时，表单验证全部自动触发 "$i18n.locale": function () { this.$nextTick(() => { this.$refs.form.clearValidate() //form是你自己表单的ref属性值

element-ui 表单自动验证问题的解决

热门推荐

胡萧徒的博客

07-28

1万+

element-ui 中的 el-form 组件自带了验证功能.当表单初始化后,每次赋值或进行相应操作.就会触发表单自动验证在开发中,有一个不太友好的问题,就是打开表单后,再打开就会触发自动校验,报一片红. 目前有两种方案应对: 1. 是使用 v-if 控制表单,这样第二次点开后表单无值,也不会触发表单自动校验. 缺点是 v-if 太消耗性能,频繁使用会导致...

vue+element UI的form表单规则校验国际化（多语言切换）

qq_38181746的博客

02-22

1997

element 表单规则校验国际化

elementUI form表单页面初始化时就自动校验了

qq_42440919的博客

12-28

6161

form表单自动校验

vue中elementUI的form表单校验，将默认的英文提示改为中文

泽渡的博客

06-21

1633

将需要修改的配置写在一个js文件中，引入main.js中。文中的提示信息如下。

vue+element ui项目国际化切换语言后表单验证提示不能自动更新

xcxcsdn的博客

10-25

1110

引自vue+element ui项目国际化表单验证规则切换语言后不能自动更新_dongwang的博客-优快云博客验证信息不能直接写在message里，写在自定义规则中，如下 let validateCode = (rule, value, callback) => { if (!value) { return callback(new Error(this.$t('common.validateCode'))) } else { return...

解决vue elementUI 切换语言 表单验证提示不更新

weixin_43846401的博客

10-25

4738

项目需要国际化处理，发现一个问题：当切换语言时表单验证的提示信息没有同时更新过来看了一些解决方案，可以把rules放到computed里，但是这样切换语言会导致整个表单重新验证，而我只想把已经提示错误信息的几个表单项改变提示语言，解决方案：不使用message传入错误提示，手动传入验证规则 let validateCode = (rule, value, callback) => ...

vue+element ui项目国际化表单验证规则切换语言后不能自动更新

dongwang的博客

08-20

1346

验证信息不能直接写在message里，写在自定义规则中 let validateCode = (rule, value, callback) => { if (!value) { return callback(new Error(this.$t('common.validateCode'))) } else { return callback() } }; rules: { code: [ {validator: validateCode, trigger: 'blur'}

【已解决】el-form required 提示英文改中文

程序边界

06-09

7020

文章目录最近发现 el-form 的 el-form-item 配置 required 之后提示是英文，类似 “xxx is required”： <el-form-item required>...</el-form-item> 即使是表单验证或是自定义校验规则，只要有在标签上设置的required，就会或是在不经意间出现英文提示。。。正确做法：去掉标签上设置的required；使用 rules 上的 required 设置： data() { retur

ELEMENT FORM表单缓存上次记录问题

mm520zh的博客

08-25

539

el-form

Vue-使用i18n实现中英文切换功能，表单验证，组件数据等

weixin_40651329的博客

03-31

1660

中英文切换功能，笔者是通过i8n实现的。本文讲述了各个场景下的中英文如何替换，包括表单验证，提示信息，各中组件等。 -安装i18n // 通过淘宝镜像安装 cnpm install vue-i18n --save -引入i18n 在src目录下创建i18n文件夹，新增i18n.js import Vue from 'vue' import locale from 'element-ui/l...

Vue+ElementUI多语言设置

cnfabu的博客

09-15

3739

使用vue+element实现多语言切换，基础详细介绍

element-ui 动态表单规则，初始化规则报红提示解决

bangbDIV的博客

04-14

7966

今天在做一个动态表单规则的需求, 但是赋值给rules规则值之后，初始化的时候，表单就会检验报红。解决办法如下： const ruleObj = { date1: [ { required: val, message: '请选择开始日期', trigger: 'change' } ], date2: [ { required: val, message: '请选择截止日期', trigger: 'change' } ], } this.rules =

【Element Ui】 vue3中修改el-form的rules后不触发自动校验,再次修改rules时清除验证信息