在项目中,不知道大家有没有遇到这样的一个问题,比如说有两个页面A,B。A页面中有某个按钮点击后可以跳转到B页面,现在有一个需求就是,我在B页面中做了某些操作,然后点击回退按钮,回到A页面,A页面中的数据也需要刷新过来。嗯,如果是做过android开发的朋友一定会知道,解决这样的需求的方法有很多,比如可以使用activity的生命周期,也可以使用广播等等,但是如果在react native中呢??

我们看一下官网可以知道,react native的生命周期不是针对于页面的,而是组件,什么意思呢?也就是说这个生命周期是组件的生命周期,而不是页面的生命周期,页面在跳转的时候,页面就会回调相应的生命周期的方法,但是组件在页面跳转的时候不一定会回调相应的生命周期方法,所以react native中,使用生命周期这个方式来刷新页面,并不是最好的选择。那么react native中有没有一个类似与广播这样的东东呢。有的,就是这个东西:DeviceEventEmitter.

在页面A中进行注册:

 import  {
DeviceEventEmitter
} from 'react-native'; //注册这个监听事件
componentDidMount(){
DeviceEventEmitter.addListener('xxxName’, Function);
}; //在组件销毁的时候要将其移除
componentWillUnmount(){
DeviceEventEmitter.remove();
};

在页面B中就可以进行掉用了:

 import  {
DeviceEventEmitter
} from 'react-native'; //调用事件通知 param是指传递的相应参数
DeviceEventEmitter.emit('xxxName’,param);

这样,我们就实现了页面的刷新了。

												

react native 刷新机制----通知的更多相关文章

  1. React Native通信机制详解

    React Native是facebook刚开源的框架,可以用javascript直接开发原生APP,先不说这个框架后续是否能得到大众认可,单从源码来说,这个框架源码里有非常多的设计思想和实现方式值得 ...

  2. [React Native]Promise机制

    React Native中经常会看到Promise机制. Promise机制代表着在JavaScript程序中下一个伟大的范式.可以把一些复杂的代码轻松撸成一个串,和Android中的rxjava非常 ...

  3. 总结react native 事件机制

    React 事件机制 一个组件的所有事件会使用统一的事件监听器,绑定到组件的最外层,那么如何使用? bind方法,绑定并且可以传递参数 <TouchableOpacity onPress={th ...

  4. React Native初探

    前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...

  5. iOS、swift、React Native学习常用的社区、论坛

    <!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...

  6. React Native指南汇集了各类react-native学习资源、开源App和组件

    来自:https://github.com/ele828/react-native-guide React Native指南汇集了各类react-native学习资源.开源App和组件 React-N ...

  7. React Native入门指南

    转载自:http://www.jianshu.com/p/b88944250b25 前言 React Native 诞生于 2015 年,名副其实的富二代,主要使命是为父出征,与 Apple 和 Go ...

  8. 写给移动开发者的 React Native 指南

    本文原创版权归 简书 wingjay 所有,如有转载,请于文章篇头位置显示标注原创作者及出处,以示尊重! 作者:wingjay 出处:http://www.jianshu.com/p/b8894425 ...

  9. react native 学习资料整理

    入门教程 深入浅出 React Native:使用 JavaScript 构建原生应用 http://www.appcoda.com/react-native-introduction/  中文版 h ...

随机推荐

  1. 关于MySQL的wait_timeout连接超时问题报错解决方案

    bug回顾 : 想必大家在用MySQL时都会遇到连接超时的问题,如下图所示: ### Cause: com.mysql.jdbc.exceptions.jdbc4.CommunicationsExce ...

  2. 在Unity中使用UGUI修改Mesh绘制几何图形

    在商店看到这样一个例子,表示很有兴趣,他们说是用UGUI做的.我想,像这种可以随便变形的图形,我第一个就想到了网格变形. 做法1: 细心的朋友应该会发现,每个UGUI可见元素,都有一个‘Canvas ...

  3. Nacl开发

    环境搭建:http://www.bojinxiaozhu.com/2014/0221/80.html http://blog.csdn.net/xoyojank/article/details/814 ...

  4. easyUI中onLoadSuccess方法获取多个对象

    后台将一个list中的对象循环放到map中,如下: @RequestMapping("/getSaleOrderDetailList") @ResponseBody public ...

  5. Gogland 个性化设置

    1.去掉 hints 提示功能: Preferences -> Editor -> General -> Appearance -> 去掉勾选 “Show parameter ...

  6. Android:控件AutoCompleteTextView 自动提示

    在文本框中输入,要这样的提示效果,如果你输入的是aac,在输入aa后,选择aac,文本框的内容会自动补齐,输入aac(类似百度搜索文本框的显示结果)   <AutoCompleteTextVie ...

  7. Interleaving String

    https://leetcode.com/problems/interleaving-string/ Given s1, s2, s3, find whether s3 is formed by th ...

  8. [mark] 使用Sublime Text 2时如何将Tab配置为4个空格

    在Mac OS X系统下,Sublime Text是一款比较赞的编辑器. 作为空格党的自觉,今天mark一下使用Sublime Text 2时如何将Tab配置为4个空格: 方法来自以下两个链接: ht ...

  9. 面向对象Part3

    继承: Extends在英文中的翻译是拓展. 但是java允许多重继承. 一条线.单线. ------------------------------------------------------- ...

  10. rpcbind服务说明及关闭

    rpcbind服务说明及关闭 Posted by 破冰 on -- : Tuesday rpcbind服务停止命令 service portmap stop redhat 的rpc.statd服务: ...