react native 刷新机制-通知

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

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,747评论 25 709
  • 持续更新中...... 一套企业级的 UI 设计语言和 React 实现。 https://mobile.ant....
    日不落000阅读 5,878评论 0 35
  • 简短说明 收录一些好用的RN第三方组件,以方便日常的使用,大家有什么推荐的也可以跟我说,我加进去。如有冒犯,可以联...
    以德扶人阅读 43,727评论 44 214
  • 何不放过自己 潇洒的转身 离开这一不值得挽留的回忆 或许你会发现 天空其实很蓝 空气其实很清新 自己其实并没有那么悲伤
    卑辰尊月阅读 164评论 0 1
  • 不管你是学生或者职场人,都经常会被要求做一些PPT演讲。然而很多人做出来的PPT是这样的, 也有人因为没做好演讲P...
    三顿ppt阅读 64,959评论 30 697