时间戳

首页 > 解决方案 > React Redux Localize 只返回第一个字母

reactjs - React Redux Localize 只返回第一个字母

问题描述

我正在尝试使用 react redux，但我遇到了一个问题。以下代码仅呈现第一个字母“T”，而不是全部“Test”。Redux 调试器显示所有“测试”。怎么会这样？

索引.js：

import React from 'react';
import ReactDOM from 'react-dom';
import App from './app';
import { localizeReducer } from 'react-localize-redux';
import { combineReducers, createStore } from 'redux';
import { LocalizeProvider } from "react-localize-redux";

const store = createStore(
    combineReducers({localize: localizeReducer})
);

ReactDOM.render(
    <LocalizeProvider store={store}>
        <App />
    </LocalizeProvider>,

    document.getElementById('root'));

应用程序.js：

import React, { Component } from 'react';
import { Translate, withLocalize } from "react-localize-redux";
import { renderToStaticMarkup } from 'react-dom/server';

class App extends Component {
    constructor(props) {
        super(props);

        this.props.initialize({
            languages: [
              { name: "English", code: "en" }
            ],
            options: { renderToStaticMarkup }
        });

        let english = {
            abc: "Test"
        }

        this.props.addTranslation(english);
    }

    render() {
        return <Translate id="abc" />;
    }
}

export default withLocalize(App);

标签： reactjslocalizationreact-redux

解决方案

如果您只想为一种语言添加翻译，您可以使用addTranslationForLanguage。这个使用单一语言格式：

let english = {
  abc: "Test"
}

this.props.addTranslationForLanguage(english, 'en');

使用多种语言时应使用addTranslation 。此 api 需要all-language-format的数据，因此您可以为多种语言执行类似此数组的操作：

let translations = {
  abc: ["Test"]
}

this.props.addTranslationForLanguage(translations);

推荐阅读