Question

我尝试本地化我的本机应用程序。我用这个代码工作正常

import LocalizedStrings from 'react-native-localization'

let strings = new LocalizedStrings({
 "en-US":{
   how:"How do you want your egg today?",
   boiledEgg:"Boiled egg",
   softBoiledEgg:"Soft-boiled egg",
   choice:"How to choose the egg"
 },
 en:{
   how:"How do you want your egg today?",
   boiledEgg:"Boiled egg",
   softBoiledEgg:"Soft-boiled egg",
   choice:"How to choose the egg"
 },
 fr: {
   how:"Come vuoi il tuo uovo oggi?",
   boiledEgg:"Uovo sodo",
   softBoiledEgg:"Uovo alla coque",
   choice:"Come scegliere l'uovo"
 }
});

export default strings

我尝试为每种语言使用一个文件。我把它改成了这个

import LocalizedStrings from 'react-native-localization'
import en from './langs/en'
import fr from './langs/fr'

let strings = new LocalizedStrings({
  en,
  fr,
});

export default strings

和en.js包含此代码

export default {
    en: {
       welcome: 'Willkommen zu Reactn Native Lokalisierung Demo!',
       change: 'Sprache ändern durch Auswahl der Option unten',
       changeLanguage: 'Sprache ändern',
       english: 'Englisch',
       deutsch: 'Deutsch'
    }
}

使用以下代码访问文本不再有效：

<Text style={styles.welcome}>
{strings.english}
</Text>

编辑：我使用了JSON文件而且工作正常

{
  "hello": "salut"
}

Answer 1

如果您想以这种方式分隔文件，您的en.js文件应如下所示：

export default
{
   welcome: 'Willkommen zu Reactn Native Lokalisierung Demo!',
   change: 'Sprache ändern durch Auswahl der Option unten',
   changeLanguage: 'Sprache ändern',
   english: 'Englisch',
   deutsch: 'Deutsch'
}

然后可以将其导入en，并用作：

let strings = new LocalizedStrings({
  en,
  fr,
});

否则，您可以将扩展运算符与当前en.js文件一起使用：

let strings = new LocalizedStrings({
  ...en,
  ...fr,
});

Answer 2

必须注意：

let strings = new LocalizedStrings({
  en,
  fr,
});

等于：

let strings = new LocalizedStrings({
  en: en,
  fr: fr,
});

这意味着你可能需要为你的模板编写这样的代码：

<Text style={styles.welcome}>
  {strings[this.props.currentLang].english}
</Text>

注意：我的示例中的this.props.currentLang是来自容器OR父组件的共享属性。

如何正确导出包含文本

2 个答案: