React Native中的全局变量/常量



在React Native中,有没有一种方法可以让我在全局变量上定义我将要使用的所有字符串,就像在Android开发中一样,有一个String.xml,你可以在其中放置所有字符串。

我所做的是创建一个全局模块。。。

//文件:Globals.js

module.exports = {
  STORE_KEY: 'a56z0fzrNpl^2',
  BASE_URL: 'http://someurl.com',
  COLOR: {
    ORANGE: '#C50',
    DARKBLUE: '#0F3274',
    LIGHTBLUE: '#6EA8DA',
    DARKGRAY: '#999',
  },
};

然后我只需要在顶部。。。

const GLOBAL = require('../Globals');

然后像这样访问它们…

GLOBAL.COLOR.ORANGE

_____________________

2018年2月10日更新

这似乎是一个非常流行和有用的答案,所以我想我应该用更新的语法来更新它。以上内容仍然适用于CommonJS模块系统,但现在您可能会遇到ES6和import模块,而不是require模块。

ECMAScript模块(ESM)语法

//文件:Globals.js

export default {
  STORE_KEY: 'a56z0fzrNpl^2',
  BASE_URL: 'http://someurl.com',
  COLOR: {
    ORANGE: '#C50',
    DARKBLUE: '#0F3274',
    LIGHTBLUE: '#6EA8DA',
    DARKGRAY: '#999',
  },
};

//使用。。。

import GLOBALS from '../Globals'; // the variable name is arbitrary since it's exported as default

//并以与之前相同的方式访问它们

GLOBALS.COLOR.ORANGE
react native中的global就像web开发中的窗口。
// declare a global varible
global.primaryColor = '***';
//now you can use this variable anywhere
console.log(primaryColor);

我也制作了一个类似Chris Geirman答案中的模块,但无法用require引用它。相反,我让它与import * as GLOBAL from '../Globals'; 一起工作

如果您想在依赖平台本地化的语言之间切换。

通过npm获取node_module

npm i react-native-localization --save 

在类中定义变量:

// Localisation.js
let LocalizedStrings = require ('react-native-localization'); 
let strings = new LocalizedStrings ({ 
 en: { 
     loginTitle:  "Login",
 }, 
 de: {
     loginTitle:  "Anmelden",
 }
})

当您需要字符串时:

var STRINGS = require ('./Localization');
<Text>{STRINGS.loginTitle}</Text>

最新更新