Question

我有一个很小的react native应用程序，在这里我尝试实现多语言，当我更改语言时可以实时重新加载组件。

我正在使用react-native-i18n库。我有我的语言组件，这是代码：

constructor(props) {
  super(props);
  this.state = { selected: 'sr_ME' };
}

async componentDidMount() {
  let currentLanguage = await this.getLocalKey('lang', 'sr_ME');
  this.setState({ selected: currentLanguage });
}

getLocalKey = async (key, defaultValue) => {
  try {
    let value = await AsyncStorage.getItem(key);
    return value != null ? value : defaultValue;
  } catch (e) {
    return defaultValue;
  }
}

storeLocalKey = async (key, value) => {
  try {
    await AsyncStorage.setItem(key, value);
  } catch (e) { 
    // handle error if necessary...
  }
};

onValueChange(value) {
  I18n.locale = value; 
  this.setState({ selected: value }, () => this.storeLocalKey('lang', value));
  this.props.updateParentState({ 'lang': value });
}
...

我正在另一个屏幕上导入的上述组件：

static navigationOptions = {
  header: null
};

state = {};

updateState(data) {
  I18n.locale = data.lang;
}

render() {
   return (
      <Container style={styles.container}>
        <Header style={styles.header}>
          <Left>
            <Text style={styles.headerTitle}>{I18n.t('home')}</Text>
          </Left>
          <Right>
            <LanguageButton updateParentState={this.updateState.bind(this)}/>
          </Right>
        </Header>
      </Container>);
    }

我正在尝试实现语言组件中语言的每一次更改都会更新语言环境并重新加载父组件，并将语言也应用于其他组件。

目前，这仅翻译导航标题中的标题，但内容保持不变。

有人知道如何解决此问题吗？预先谢谢你。

Answer 1

您可以使用以下npm react-native-localization进行多语言应用。您可以在字符串js文件中定义多种语言。

// ES6模块语法

从'react-native-localization'导入LocalizedStrings;

letstrings =新的LocalizedStrings（{

en：{

方式：“您今天想怎样做？”，

boiledEgg：“煮鸡蛋”，

softBoiledEgg：“软煮蛋”，

选择：“如何选择鸡蛋”

}，

它：{

如何：“来吧，我来了，”，

boiledEgg：“ Uovo sodo”，

softBoiledEgg：“ Uovo alla coque”，

选择：“来吧，scegliere l'uovo”

}

}）;

对于更改语言，您可以在要更改语言的代码表上使用此功能强制使用某种特定语言：

从'react-native-restart'导入RNRestart;

_onSetLanguageToItalian（）{

strings.setLanguage（'it'）;

this.setState（{}）;

RNRestart.Restart（）

}

react-native-restart npm用于重新启动应用程序并将语言更改反映到整个应用程序中

反应本机多语言问题

1 个答案: