не удалось создать правильный экземпляр i18next, чтобы использовать его реагирующий компонент - PullRequest
Новая
       26

не удалось создать правильный экземпляр i18next, чтобы использовать его реагирующий компонент

0 голосов
/ 11 октября 2019

Я пытаюсь создать экземпляр i18next. Но значение экземпляра отличается тем, что в компоненте React происходит сбой 

import i18n from 'i18next';
import { reactI18nextModule } from 'react-i18next';
import Backend from 'i18next-xhr-backend';
import LanguageDetector from 'i18next-browser-languagedetector';

const config = {
ns: ['translations'],
defaultNS: 'translations',
fallbackLng: 'en',
backend: {
    loadPath: 'locale/{{lng}}.json',
    addPath: '{{lng}}',
},
detection: {
    caches: null
},
debug: true,
react: {
    wait: true,
    withRef: false,
    interpolation: {
        escapeValue: false, // not needed for react!
    },
    bindI18n: 'languageChanged',
    bindStore: false,
    nsMode: 'default'
}
};
i18n.use(Backend)
.use(LanguageDetector)
.use(reactI18nextModule).init(i18nconfig);
console.log(i18n);
export default i18n;

Предоставление структуры вместо всего объекта. Получаемое значение: 

    changeLanguage: (...)
cloneInstance: (...)
createInstance: (...)
default: I18n {observers: {…}, options: {…}, services: {…}, logger: Logger, modules: {…}, …}
dir: (...)
exists: (...)
getFixedT: (...)
init: (...)
loadLanguages: (...)
loadNamespaces: (...)
loadResources: (...)
off: (...)
on: (...)
setDefaultNamespace: (...)
t: (...)
use: (...)
get changeLanguage: ƒ ()
get cloneInstance: ƒ ()
get createInstance: ƒ ()
get dir: ƒ ()
get exists: ƒ ()
get getFixedT: ƒ ()
get init: ƒ ()
get loadLanguages: ƒ ()
get loadNamespaces: ƒ ()
get loadResources: ƒ ()
get off: ƒ ()
get on: ƒ ()
get setDefaultNamespace: ƒ ()
get t: ƒ ()
get use: ƒ ()
__proto__: Object

ЖелаемыйРезультат должен быть 

addResource: ƒ ()
addResourceBundle: ƒ ()
addResources: ƒ ()
format: ƒ format(value, _format, lng)
getDataByLanguage: ƒ ()
getResource: ƒ ()
getResourceBundle: ƒ ()
hasResourceBundle: ƒ ()
isInitialized: true
language: "en-US"
languages: (2) ["en-US", "en"]
logger: Logger {prefix: "i18next:", logger: {…}, options: {…}, debug: true}
modules: {external: Array(0), backend: ƒ, languageDetector: ƒ}
observers: {initialized: Array(0), languageChanged: Array(28)}
options: {debug: true, initImmediate: true, ns: Array(1), defaultNS: "translations", fallbackLng: Array(1), …}
removeResourceBundle: ƒ ()
services: {logger: Logger, resourceStore: ResourceStore, languageUtils: LanguageUtil, pluralResolver: PluralResolver, interpolator: Interpolator, …}
store: ResourceStore {observers: {…}, data: {…}, options: {…}}
translator: Translator {observers: {…}, resourceStore: ResourceStore, languageUtils: LanguageUtil, pluralResolver: PluralResolver, interpolator: Interpolator, …}
__proto__: EventEmitter

Если я передам экземпляр i18n (первый) через I8nextProvider моему компоненту реакции. Я вижу следующую ошибку 

backend.js:6 react-i18next:: You will need pass in an i18next instance either by props, using I18nextProvider or by using i18nextReactModule. Learn more https://react.i18next.com/components/overview#getting-the-i-18-n-function-into-the-flow 
    in NamespacesConsumerComponent (created by WithMergedOptions)
    in WithMergedOptions (created by Context.Consumer)
    in Context.Consumer (created by WithMergedOptions(NamespacesConsumerComponent))
    in WithMergedOptions(NamespacesConsumerComponent) (created by LoadNamespace)
    in LoadNamespace (created by WithMergedOptions)
    in WithMergedOptions (created by Context.Consumer)
    in Context.Consumer (created by LoadNamespace(EstimateResultsView))
    in LoadNamespace(DemoComponent)

NamespacesConsumer.js:154 Uncaught TypeError: Cannot read property 'loadNamespaces' of undefined
    at NamespacesConsumerComponent.loadNamespaces (NamespacesConsumer.js:154)
    at NamespacesConsumerComponent.componentDidMount (NamespacesConsumer.js:72)
    at commitLifeCycles (react-dom.development.js:20049)
    at commitLayoutEffects (react-dom.development.js:22813)
    at HTMLUnknownElement.callCallback (react-dom.development.js:347)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:397)
    at invokeGuardedCallback (react-dom.development.js:454)
    at commitRootImpl (react-dom.development.js:22585)
    at unstable_runWithPriority (scheduler.development.js:643)
    at runWithPriority$2 (react-dom.development.js:11305)

Используемая версия: i18следующий: 13.1.5 Reaction-i18следующий: 9.0.10

...