React Native开发React Native开发经验集

使用react-native-event-bus解决跨页面通信

2019-12-16  本文已影响0人  景元合

前言

今天项目中列表页和收藏页面直接要实现互相通信,于是使用到了react-native-event-bus,下面大致说一下使用方法。

安装

npm i react-native-event-bus --save
import EventBus from 'react-native-event-bus'

使用

<Tab 
    onNavigationStateChange={(prevState,nextState,action)=>{
        EventBus.getInstance().fireEvent(NavigationUtil.bottom_tab_select, {
            from:prevState.index,
            to:nextState.index
        })
          }}
 />
componentDidMount(){
    this.loadData();
    EventBus.getInstance().addListener(NavigationUtil.bottom_tab_select, this.listener = data => {
      if(data.to==2){
        this.loadData(false);
      }
    })
  }
  componentWillUnmount() {
    EventBus.getInstance().removeListener(this.listener);
  }

总结

到此为止由列表页点击收藏,切换到收藏页会监听到变化,可以刷新数据。

上一篇 下一篇

猜你喜欢

热点阅读