reactjs - 订阅 i18n 到 mobx，基于 observable react 进行翻译

Question

我正在使用 i18n 为我的项目提供翻译，目前它将根据浏览器语言进行翻译。我希望它不是基于 mobx 商店中的属性更改语言。

我试过调查react-mobx-i18n，这似乎是一个糟糕的解决方案。因为我必须将每个组件都注释为可翻译并重组所有内容。

import i18n from 'i18next'

i18n
    .init({
        fallbackLng: 'en',
        resources: {

        },
        ns: ['application'],
        defaultNS: 'application',

        react: {
            wait: true,
        },
    })

export default i18n

这是我的 App.js 的渲染

import React, { Component } from 'react';
import { I18nextProvider } from 'react-i18next'
import i18n from './i18n'
import { Provider } from 'mobx-react'

export default class App extends Component {

 render() {

        return (
            <Provider {...this.props.stores}> //mobx stores
                <I18nextProvider i18n={i18n}> 
                //router want to change mobx-state and rerender everything with a new language
                </I18nextProvider>
            </Provider>
        )
    }
}

我想以某种方式让 i18n 订阅我的 mobx 状态并在检测到新语言时更新。如果这是不可能的，那么我想在商店中编写一个处理程序来根据一些输入更改语言。

标签： reactjsinternationalizationmobx