response-i18следующий: строки не переводятся - PullRequest
Новая
       21

response-i18следующий: строки не переводятся

1 голос
/ 08 апреля 2020

У меня была неприятная проблема с библиотекойact-i18next. Я просто не мог заставить библиотеку переводить строки в моем приложении.

Код был следующим:

App.tsx: 

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

import resources from './resources';

// code omitted...

i18n
  .use(initReactI18next)
  .init({
    resources,
    lng: 'en',
    interpolation: {
      escapeValue: false,
    },
  });

// rest of the code here...

resources / index .tsx: 

export default {
  en: {
    'Math Visualized': 'Math Visualized asd',
  },
  fi: {
    'Math Visualized': 'Matematiikan visualisointia',
  },
};

components / header / Header.tsx: 

import { withTranslation } from 'react-i18next';

// code omitted...

class HeaderComponent extends React.Component<Props, State> {
  render() {
    const { headerText, subheaderText, t } = this.props;

    // react-bootstrap used here
    return (
      <Navbar bg="dark" variant="dark">
        <Navbar.Brand>{t(headerText)}</Navbar.Brand>
        {subheaderText && <Navbar.Text>{t(subheaderText)}</Navbar.Text>}
      </Navbar>
    );
  }
}

export const Header = withTranslation()(HeaderComponent);

Текстовые строки заголовка и подзаголовка просто отказались переводиться.

1 Ответ

1 голос
/ 08 апреля 2020

Я просто забыл добавить пространство имен translation в файл ресурсов. Я изменил это так: 

export default {
  en: {
    translation: { // THIS NAMESPACE HERE WAS MISSING
      'Math Visualized': 'Math Visualized asd',
    },
  },
  fi: {
    translation: {
      'Math Visualized': 'Matematiikan visualisointia',
    },
  },
};

И все заработало.

...