如何在React中配置yup-locales法语本地化作为验证语言

全局配置（推荐） #

全局设置后，所有Yup验证规则都会默认使用法语提示，无需逐个Schema配置：

1. 在项目入口文件（如index.js或App.js）中导入Yup和法语本地化文件
2. 调用setLocale方法设置法语环境

import * as yup from 'yup';
import { fr } from 'yup-locales';

// 全局启用法语验证提示
yup.setLocale(fr);

局部配置（针对单个Schema） #

如果只想为特定的验证Schema启用法语提示，可采用以下两种方式：

方式一：使用locale方法 #

import * as yup from 'yup';
import { fr } from 'yup-locales';

const userSchema = yup.object().shape({
  email: yup.string().email().required(),
  password: yup.string().min(8).required(),
}).locale(fr);

方式二：创建Schema时指定locale参数 #

import * as yup from 'yup';
import { fr } from 'yup-locales';

const userSchema = yup.object({
  email: yup.string().email().required(),
  password: yup.string().min(8).required(),
}, { locale: fr });

自定义提示（覆盖默认本地化文本） #

如果需要针对特定字段自定义法语提示，直接在验证规则中传入自定义文本即可，自定义内容会优先于本地化文件中的默认提示：

import * as yup from 'yup';
import { fr } from 'yup-locales';

yup.setLocale(fr);

const userSchema = yup.object().shape({
  email: yup.string()
    .email('Votre adresse email n\'est pas valide')
    .required('L\'adresse email est obligatoire'),
  password: yup.string()
    .min(8, 'Le mot de passe doit contenir au moins 8 caractères')
    .required('Le mot de passe est obligatoire'),
});

内容的提问来源于stack exchange，提问作者Isra_Yas