Установка языка по умолчанию для реагирования js (избыточный) - PullRequest
Новая
       17

Установка языка по умолчанию для реагирования js (избыточный)

0 голосов
/ 11 марта 2019

Я пытаюсь сделать язык en по умолчанию для моего приложения реагировать на избыточность, сейчас я вставляю язык в хранилище, но хочу использовать файл en.json в своей папке lang, а затем сделать переключательмежду языками.

ConfigStore.js 

import { ReduceStore } from 'flux/utils';
import ActionTypes from '../constants/AppConstants';
import AppDispatcher from '../dispatcher/AppDispatcher';
import config from '../../config';


class ConfigStore extends ReduceStore {

    getInitialState() {
        return {
            language: 'en',
            languageLabels: {}
        };
    }

    reduce(state, action) {
        switch (action.type) {
            case ActionTypes.LANGUAGE_REQUEST:
                var newState = Object.assign({}, state);
                newState.languageLabels = action.data;
                return newState;
            default:
                return state;
        }
    }
}

export default new ConfigStore(AppDispatcher);

App.js 

    import React from "react";
    import { render } from "react-dom";
    import { BrowserRouter as Router, Route } from "react-router-dom";
    import Main from "./components/Main";
    import ErrorBoundary from "./components/ErrorBoundary";

    render(
        <Router>
            <ErrorBoundary>
                <div>
                    <Route path="/" component={ Main }/>
                </div>
            </ErrorBoundary>
        </Router>,
        document.getElementById("root")
    );

config.js

это файл, в котором у меня есть настройки по умолчанию 

const config = {
ServiceConfig: {
    url: 'http://192.168.30.145',
    port: '4000',
    ip: '127.0.0.1'
},

AppConfig: {
    appID: 'wsTrader',
    appName: 42,
    isManager: 0,
    key: '!@#TempKey',
    phoneLine: '0'
},

SiteConfig: {
    defaultLanguage: 'en'
}
};

module.exports = config;

1 Ответ

0 голосов
/ 11 марта 2019

Вы можете использовать пакет под названием шлем , чтобы справиться с этим: 

import { Helmet } from 'react-helmet';

Тогда в вашем методе рендеринга вы можете получить что-то вроде этого: 

class Application extends React.Component {
  render () {
    return (
        <div className="application">
            <Helmet htmlAttributes={{ lang: some.language.from.redux.store }}>
                <meta charSet="utf-8" />
                <title>My Title</title>
            </Helmet>
            ...
        </div>
    );
  }
};
...