我正在使用非常标准的 facebooks create-react-app 构建一个 React 应用
我正在使用 i18next 来支持本地化,我也需要多元化,我正在使用 ICU 来支持多元化,这里是支持多元化的 ICU 格式示例。
"VALID_FOR_DAYS": "{count, plural, one{Valid for {count} more day} other{Valid for {count} more days}}",
这是我在我的 React 项目中的 i18 配置
import i18n from 'i18next';
import I18nextIcu from 'i18next-icu';
const icu = new I18nextIcu();
export const initilizeLocaleSettings = async (defaultLocale: string): Promise<void> => {
await i18n
.use(icu)
.use(initReactI18next)
.init({
resources: {
en: {
translation: {
WELCOME: 'Welcome {{name}}',
VALID_FOR_DAYS": "{count, plural, one{Valid for {count} more day} other{Valid for {count} more days}}",
}
}
},
lng: defaultLocale,
fallbackLng: defaultLocale,
interpolation: {
escapeValue: false
}
});
};
import { useTranslation } from 'react-i18next';
function App() {
const { t } = useTranslation();
return (
<h1>
{t('VALID_FOR_DAYS', { count: 10 })}
{t('WELCOME', { name: 'JOHN DOE' })}
</h1>
);
}
复数化效果很好 VALID_DAYS 得到完美翻译 但是 WELCOME 它不会给我以下错误
语法错误:应为“0”、[1-9] 或 [^\t\n\r,.+={}#] 但找到了“{”。
最佳答案
欣赏这是前一段时间,但你不需要双花括号:
这个:
translation: {
WELCOME: 'Welcome {{name}}',
VALID_FOR_DAYS": "{count, plural, one{Valid for {count} more day} other{Valid for {count} more days}}",
}
应该是:
translation: {
WELCOME: 'Welcome {name}',
VALID_FOR_DAYS": "{count, plural, one{Valid for {count} more day} other{Valid for {count} more days}}",
}
关于reactjs - i18next-icu 在 react 中翻译时不支持 {{(双括号),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59901057/