使用 i18next 翻译挂钩获取错误消息

问题描述

所以我有一个可以正常工作的表单，对于错误消息，我创建了一个架构文件，其中包含这样定义的错误

export const dataInputCreateSchema = yupObject({
    company: yup.object().required('This field is required').nullable
  })

在我的组件中，我像这样初始化 i18next 翻译变量 const { t } = useTranslation('common')。至于在用户触摸文本框并且不写任何内容的情况下显示错误消息，则将显示必填字段错误，其工作方式如下

const companyFieldError = _.get(errors,'company','');

_.get 是一个 lodash 方法，它接收一个对象、路径和默认值。

我需要知道如何将在 common.json 文件中定义的翻译传递给 companyFieldError？在 common.json 中的翻译就像

"errorMessages": { 
     "requiredField": "This is required Field"
  }

我不想丢弃我的架构文件，但我想在那里提供密钥并且该密钥必须被翻译。有没有办法做到这一点？

解决方法

为了支持翻译错误，我将进行一些更改。

1. 使用架构定义中的消息。

export const dataInputCreateSchema = yupObject({
    company: yup.object().required('errorMessages.requiredField').nullable
  })

2. 使用消息获取翻译文本。

const message = _.get(errors,'company','');
const companyFieldError = t(message);