Question

我是React Native的初学者。我熟悉PHP。在PHP中，有一个名为$ _SESSION的全局变量。会话是一种可以在多个页面上使用的信息（变量）存储方式。

我已经创建了一个带有react native的登录页面，通过获取mysql数据库，我获得了用户的身份，该身份将在随后的许多页面的各种过程中使用。我想将用户的身份设为全局变量。

我的问题是，react native是否有全局变量？

如何声明它？是在这里声明的，结构如何？

(/\*)(.*\n)*?(.*;\n)(.*\n)(.*\*/)

怎么称呼它？使用像这里的模型吗？

    constructor(props){
        super(props);
        this.state={
        }
    }

感谢您的帮助

Answer 1

声明=> [global.SampleVar ='这是全局变量。']

通话=> [console.log（global.SampleVar）]

Answer 2

您可以使用React上下文，它提供了一种通过组件树传递数据的方法，而不必在每个级别手动传递道具。

首先，您必须创建React Context本身，使您可以访问Provider和Consumer组件。使用React通过createContext创建上下文时，可以将其传递给初始值。初始值也可以为null。

请看以下内容：

// src/ThemeContext.js
import React from 'react';
const ThemeContext = React.createContext(null);
export default ThemeContext;

第二，组件A必须使用给定的Provider组件提供上下文。在这种情况下，它的值会立即提供给它，但是它可以是任何值，从组件状态（例如，提取的数据）到道具。如果该值来自可修改的React State，则传递给Provider组件的值也可以更改。

// src/ComponentA.js
import React from 'react';
import ThemeContext from './ThemeContext';
const A = () => (
  <ThemeContext.Provider value="green">
    <D />
  </ThemeContext.Provider>
);

组件A仅显示组件D，但不向其传递任何道具，而是使绿色值可用于以下所有React组件。子组件之一将是最终使用上下文的组件C。

第三，在组件C中，组件D下，您可以使用上下文对象。请注意，组件A不需要通过道具中的组件D传递任何东西，就可以到达组件C。

// src/ComponentC.js
import React from 'react';
import ThemeContext from './ThemeContext';
const C = () => (
  <ThemeContext.Consumer>
    {value => (
      <p style={{ color: value }}>
        Hello World
      </p>
    )}
  </ThemeContext.Consumer>
);

该组件可以通过使用上下文来派生其样式。消费者组件通过使用渲染道具使传递的上下文可用。可以想象，按照这种方式，每个需要根据主题进行样式设置的组件现在都可以通过使用ThemeContext的Consumer组件从React的Context中获取必要的信息。您只需使用Provider组件，该组件会将值传递一次到它们上方的某个位置。

Answer 3

在文件夹结构（myVariables.js）中创建一个js文件。添加带有全局前缀的变量像：global.domain =“ www.xyz.com”

然后将文件导入到app.js中（导入./myVariables.js）现在访问组件中声明的全局变量像：global.domain

Answer 4

我知道的最好方法是使用redux ，但是如果您不想要，可以创建一个global.ts文件，定义变量，创建setter和getter以及更多...

global.ts

class Variables {
    private myNumber:number = 0;
    private myName:string = ''
    // you can define more variables

    public get_myNumber(){
        return this.myNumber;
    }

    public set_myNumber(new_number:number){
        this.myNumber = new_number;
    }

    public get_myName(){
        return this.myname;
    }

    public set_myName(new_name:string){
        this.myName = new_name;
    }

}

export default new Variables() // this line is important because make this class singleton,so it will same in every where you want to use it
//also you can use react and react native functionality like Dimension as like as use in normal js file,for example you can set width and heigth from "import { Dimension } from 'react-native' in this file and use it globaly

React Native：如何声明和调用全局变量

4 个答案: