详解React native全局变量的使用(跨组件的通信)

 更新时间:2017年09月07日 11:53:21   作者:RitchieWei  
本篇文章主要介绍了详解React native全局变量的使用(跨组件的通信),具有一定的参考价值,有兴趣的同学可以了解一下

RN中有两种方式使用全局变量

1.通过导入导出文件的方式

新建constants.js文件

const object = {
  website:'http://www.hao123.com',
  name:'好123',
};
export default object;

需要用到的时候导入文件

import constants from './constansts.js'
<Text>{constants.name}</Text>

还可以有另外一种导入文件的写法

export default {
  website:'http://www.hao123.com',
  name:'好123',
};

2.通过声明全局变量的方式

一定是先声明,后调用。

global.a = 1;
<Text>{a}</Text>

也可以专门写在一个文件当中。

global.constants = {
  website:'http://www.baidu.com',
  name:'百度',
};

调用方法,入口文件一次调用(比如index.ios.js文件),全局使用。

import './constants.js';
<Text>{global.constants.name}</Text>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 从零搭建Webpack5-react脚手架的实现步骤(附源码)

    从零搭建Webpack5-react脚手架的实现步骤(附源码)

    本文主要介绍了从零搭建Webpack5-react脚手架的实现步骤,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-08-08
  • 一个基于react的图片裁剪组件示例

    一个基于react的图片裁剪组件示例

    本篇文章主要介绍了一个基于react的图片裁剪组件示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-04-04
  • ES6 class类链式继承,实例化及react super(props)原理详解

    ES6 class类链式继承,实例化及react super(props)原理详解

    这篇文章主要介绍了ES6 class类链式继承,实例化及react super(props)原理,结合实例形式详细分析了ES6 中class类链式继承,实例化及react super(props)原理相关概念、原理、定义与使用技巧,需要的朋友可以参考下
    2020-02-02
  • React服务端渲染原理解析与实践

    React服务端渲染原理解析与实践

    这篇文章主要介绍了React服务端渲染原理解析与实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-03-03
  • React Native 图片查看组件的方法

    React Native 图片查看组件的方法

    这篇文章主要介绍了React Native 图片查看组件的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-03-03
  • webpack入门+react环境配置

    webpack入门+react环境配置

    webpack是一个前端资源模块化管理和打包工具,说白了就是方便我们管理自己的常用的一些代码,比如你开发中用到sass以及jade同时用到es6,开发时你不可能改动某个地方就挨个命令去转换再到浏览器去看效果,那样效率是非常低的。所以webpack帮我们省去了那些多余的步骤。
    2017-02-02
  • React.js中常用的ES6写法总结(推荐)

    React.js中常用的ES6写法总结(推荐)

    本篇文章中主要介绍了React.js中常用的ES6写法总结(推荐),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • 在React中写一个Animation组件为组件进入和离开加上动画/过度效果

    在React中写一个Animation组件为组件进入和离开加上动画/过度效果

    这篇文章主要介绍了在React中写一个Animation组件为组件进入和离开加上动画/过度效果,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-06-06
  • React学习笔记之条件渲染(一)

    React学习笔记之条件渲染(一)

    条件渲染在React里就和js里的条件语句一样。下面这篇文章主要给大家介绍了关于React学习记录之条件渲染的相关资料,文中介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。
    2017-07-07
  • 详解Ref在React中的交叉用法

    详解Ref在React中的交叉用法

    众所周知,react推出了hooks之后,很多项目就开始往hooks上靠拢,所以也就出现了class和hooks交叉使用的项目。这个时候使用ref需要注意一些东西
    2021-06-06

最新评论