i18next和API道具

1.安装i18next：

npm install i18next --save

2.在React组件中使用i18next（假设我们的文本在en.json和fr.json文件中）：

import i18n from 'i18next'; import { initReactI18next } from 'react-i18next'; import en from './locales/en.json'; import fr from './locales/fr.json';

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

function App() { const { t } = useTranslation(); return <h1>{t('hello_world')}</h1>; }

3.使用API道具获取i18n配置：

import React from 'react'; import PropTypes from 'prop-types'; import { withTranslation } from 'react-i18next';

class Greeting extends React.Component { render() { const { t } = this.props;

return (
  <div>{t('hello_world')}</div>
);

} }

Greeting.propTypes = { t: PropTypes.func.isRequired, };

export default withTranslation()(Greeting);

现在你可以使用Greeting组件在你的应用程序中，并且确保有正确的i18n选项存在。