Antd-vue 表单动态修改错误提示语

2022-01-19  本文已影响0人  莫伊剑客

Antd-vue Form表单在表单出现错误提示语后,动态切换多语言导致提示语不能动态更新为相应的语言!

Form表单 解决方案一

// 获取表单的错误项
// 参数可以是具体项名称也可以不传(查询所有错误项);
const values=this.form.getFieldsValue();
const errors=this.form.getFieldsError();
errors.map(item=>{
    this.form.setFields({
      [item]:{
        value:values[item],
        //错误信息根据需要自行设置
        errors:[new Error(this.$t('xxxxxx'))]
        //errors也可是h 函数创建的虚拟dom
        //errors:[vnode]
      }
    })
})

Form表单使用setFields设置之后,错误信息可以自动刷新

Form表单 解决方案二

const values=this.form.getFieldsValue();
const errors=this.form.getFieldsError();
errors.map(item=>{
    this.validateRules[item].rules[规则]
})
//修改验证规则后再次调用表单验证触发错误信息更新
this.form.validateFields((error,values)=>{})

一定要调用validateFields再次验证才能触发信息跟新

Antd-vue FormModel表单在表单出现错误提示语后,动态切换多语言导致提示语不能动态更新为相应的语言!

FormModel表单 解决方案

this.rules[name]=[规则]
//修改验证规则后再次调用表单验证触发错误信息更新
this.form.validate((ok,values)=>{});

一定要调用validate再次验证才能触发信息跟新

上一篇下一篇

猜你喜欢

热点阅读