在React Native App中將語言更改為用戶偏好

Question

我正在使用React Native創建一個應用程序，並且需要能夠“即時”更改應用程序的語言。 我在這里關注了示例： https : //github.com/appfoundry/react-native-multi-language-sample 。 完成此操作后，我已經成功設置了Redux和所有附帶的庫。

我遇到的問題是，我試圖從警報彈出窗口而不是選擇器中觸發我的操作，而我在實際分派操作時遇到了問題。

如果有人可以告訴我如何使用警報來更改用戶語言，那將是很棒的。

謝謝！

Answer 1

我曾嘗試過一種可能會幫助您的情況。

我使用react-native-i18n （ https://github.com/AlexanderZaytsev/react-native-i18n ）並創建了一個包含所有翻譯內容的文件。 像這樣：

I18n.translations = {
  en: {
    helloWorld: 'Hello World!',
    loginButton: 'Login',
  }
}

然后，將其導入到我的組件中，該組件包含應翻譯的文本，並像這樣使用它：

<View>
  <Text>{I18n.t('helloWorld'}</Text>
</View>

我將用戶語言存儲在數據庫中，並在用戶登錄我的應用程序時得到它並在我的reducer中進行設置。 首先，我從I18n.currentLocale()方法獲取語言。

在我的組件中，我從減速器獲取用戶語言，並將其設置為I18n config： I18n.locale = this.props.language;

在此組件中，我有一個選擇器，因此用戶可以選擇其語言。 我觸發一個操作來更新我的數據庫以及reducer，並使用componentWillReceiveProps()生命周期來更新I18n.locale值

componentWillReceiveProps(nextProps) {
    I18n.locale = nextProps.language;
  }

希望能幫助到你