Транс-компонент не отображает перевод без атрибута i18nKey - PullRequest
Новая
       5

Транс-компонент не отображает перевод без атрибута i18nKey

0 голосов
/ 29 сентября 2019

У меня есть приложение, использующее компонент Trans для выполнения переводов.Я не объявляю атрибут i18nKey в своем компоненте Trans, а просто использую содержимое внутри компонента Trans для генерации ключа, но даже если ключ существует, Trans не произведет перевод, если не присутствует i18nKeyна компоненте.Функция t из useTranslation правильно переводит свои аргументы, но в этом примере компонент Trans не будет переводиться на французский.Полный проект на github здесь Пример в моем приложении:

index.jsx 

import React from 'react';
import ReactDOM from 'react-dom';
import { I18nextProvider } from 'react-i18next';
import URLSearchParams from '@ungap/url-search-params';
import 'web/js/sentry';
import 'react-toastify/dist/ReactToastify.css';

import { Root } from 'web/js/page/root';

import i18n from 'common/i18n';

if (!window.URLSearchParams) {
  window.URLSearchParams = URLSearchParams;
}

ReactDOM.render(
  <I18nextProvider i18n={i18n}>
    <Root />
  </I18nextProvider>,
  document.querySelector('.projectroot'),
);

topic / hangul / index.jsx 

import React from 'react';
import { Trans } from 'react-i18next';

import { Utterance } from 'web/js/application-hook/utterance';

import './style.scss';

export function Hangul() {
  return (
    <div styleName='root'>
      <section styleName='section'>
        <Trans>
          <Utterance text='한글'>한글</Utterance> and <Utterance text='조선글'>조선글</Utterance> are the respective names of the contemporary Korean writing system used in South Korea and North Korea.
        </Trans>
        &nbsp;
        <Trans>
          <Utterance text='훈민정음'>훈민정음</Utterance>, the original name of the writing system, was introduced and promoted in 1446 by Sejong the Great.
        </Trans>
      </section>
    </div>
  );
}

общие / i18n.js 

import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';

import fr from 'common/i18n/fr/translation.json';
import { SUPPORTED_LANGUAGE_IDS } from 'common/models';

i18n
.use(initReactI18next)
.init({
  preload: SUPPORTED_LANGUAGE_IDS,
  fallbackLng: 'en',
  initImmediate: false,
  returnEmptyString: false,
  resources: {
    fr: {
      translation: fr
    }
  },
  interpolation: {
    escapeValue: false
  },
  react: {
    hashTransKey: function(defaultValue) {
      console.log('missing key', defaultValue);

      return defaultValue;
    },
  }
});

export default i18n;

общие / i18n / fr / translation.json 

{
  "The Korean Writing System": "Le système d'écriture coréen",
  "<0>한글</0> and <2>조선글</2> are the respective names of the contemporary Korean writing system used in South Korea and North Korea.": "<0>한글</0> et <2>조선글</2> sont les noms respectifs du système d'écriture coréen contemporain utilisé en Corée du Sud et en Corée du Nord.",
  "<0>훈민정음</0>, the original name of the writing system, was introduced and promoted in 1446 by Sejong the Great.": "<0>훈민정음</0>, le nom original du système d'écriture, a été introduit et promu en 1446 par Sejong le Grand."
}

1 Ответ

0 голосов
/ 29 сентября 2019

Я выяснил, почему это происходит, в параметрах конфигурации для i18, по умолчанию keySeparator равно ., поэтому весь мой текст, который содержал символ ., неправильно вычислялперевод из-за ., действующего в качестве ключевого оператора.

...