这是我的代码。
import React, { Suspense } from 'react';
import { useTranslation } from 'react-i18next';
function Page() {
const { t, i18n } = useTranslation();
const changeLanguage = lng => {
i18n.changeLanguage(lng);
};
return (
<div className="App">
<div className="App-header">
<button onClick={() => changeLanguage('de')}>de</button>
<button onClick={() => changeLanguage('en')}>en</button>
</div>
<div>{t('test')}</div>
</div>
);
}
export default function App() {
return (
<Suspense fallback={<div>loading...</div>}>
<Page />
</Suspense>
);
}
当我点击
de en
按钮。我得到这个错误。 TypeError: i18n.changeLanguage 不是函数。如何修复?
最佳答案
好像没有配置i18next
.
您需要创建一个文件 i18n.js
包含以下内容:
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import Backend from 'i18next-xhr-backend';
import LanguageDetector from 'i18next-browser-languagedetector';
i18n
.use(Backend)
.use(LanguageDetector)
.use(initReactI18next)
.init({
fallbackLng: 'en',
debug: true,
interpolation: {
escapeValue: false,
}
});
export default i18n;
然后将其导入您的
index.js
:import React, { Component } from "react";
import ReactDOM from "react-dom";
import App from './App';
import './i18n';
ReactDOM.render(
<App />,
document.getElementById("root")
);
source
关于javascript - i18n.changeLanguage 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58176222/