Javascript React Native 有全局作用域吗?如果没有,我该如何模仿?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/32192064/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 07:43:43  来源:igfitidea点击:

Does React Native have global scope? If not, how can I mimic it?

javascriptreactjsreact-native

提问by ksongz

I haven't been able to find anything like

我找不到类似的东西

$rootScope

for React Native and I want to share a couple variables between different Views.

对于 React Native,我想在不同的视图之间共享几个变量。

采纳答案by Jakemmarsh

Storing variables in the global scope is a bit of an anti-pattern in React. React is intended to be used with a one-way data flow, meaning data flows down from components to their children. This is achieved through the passing of props.

在全局范围内存储变量是 React 中的一种反模式。React 旨在与单向数据流一起使用,这意味着数据从组件向下流向其子组件。这是通过传递 props来实现

In order to share a value between multiple views, you would either need to store the data on a shared parent component and pass it down as a propOR store it in a separate entity that is responsible for data management. In ReactJS this is achieved through patterns like Flux, but I'm not sure about the options for react-native.

为了在多个视图之间共享一个值,您需要将数据存储在一个共享的父组件上,并将其作为propOR 将其传递给一个负责数据管理的单独实体。在 ReactJS 中,这是通过像Flux这样的模式来实现的,但我不确定 react-native 的选项。

回答by Germinate

The global scope in React Native is variable global.

React Native 中的全局作用域是全局变量。

global.foo = foo

global.foo = foo

Then you can use global.fooanywhere.

然后你可以global.foo在任何地方使用。

But do not abuse it!In my opinion, global scope may used to store the global config or something like that. Share variables between different views, as your description, you can choose many other solutions(use redux,flux or store them in a higher component), global scope is not a good choice.

但不要滥用它!在我看来,全局范围可能用于存储全局配置或类似的东西。在不同视图之间共享变量,作为您的描述,您可以选择许多其他解决方案(使用 redux、flux 或将它们存储在更高的组件中),全局范围不是一个好的选择。

A good practice to define global variable is to use a js file. For example global.js:

定义全局变量的一个好习惯是使用 js 文件。例如global.js

global.foo = foo;
global.bar = bar;

Then, to make sure it is executed when project initialized. For example, import the file in index.js:

然后,确保在项目初始化时执行它。例如,将文件导入index.js

import './global.js'
// other code

Now, you can use the global variable anywhere, and don't need to import global.js in each file. Try not to modify them!

现在,您可以在任何地方使用全局变量,而无需在每个文件中导入 global.js。尽量不要修改它们!

回答by Yegor

For example, you can export class with static properties and then import there when need.

例如,您可以导出具有静态属性的类,然后在需要时导入。

In main.js for example:

以 main.js 为例:

export class AppColors {
    static colors = {main_color: "#FFEB3B", secondary_color: "#FFC107"}
}

In other file, where need to get this colors

在其他文件中,哪里需要获取这种颜色

import { AppColors } from './main.js';

class AnotherPage {
    constructor() {
        super();
        console.log(AppColors.colors); // youla! You will see your main and secondary colors :)
    }
}

回答by kalpesh

Step 1. create ConstantFile.jsFile and put this code.

步骤 1. 创建ConstantFile.js文件并放置此代码。

export class ConstantClass {
    static webserviceName = 'http://172.104.180.157/epadwstest/';
    static Email = 'emailid';
    static Passoword = 'password';
}

Step 2. Access as like below. But before that, you need to importyour js file to particular class file something like that

步骤 2. 访问如下。但在此之前,您需要将importjs 文件转换为特定的类文件

import { ConstantClass } from './MyJS/ConstantFile.js';

ConstantClass.webserviceName

ConstantClass.Email

ConstantClass.Passoword

回答by adamTrz

You can store those values in parent components state. Then pass methods changing those values via props or context / or like @Jakemmarsh suggested - use Flux/Reduxapproach.

您可以将这些值存储在父组件状态中。然后通过道具或上下文/或像@Jakemmarsh 建议的那样传递更改这些值的方法 - 使用Flux/ Redux方法。

OR, you can use AsyncStorage. Its useful for storing app data like tokens and such.

或者,您可以使用AsyncStorage。它对于存储应用程序数据(如令牌等)很有用。