同原生一样,react native 同样也有事件监听和回调函数这玩意.
场景很多,比如:A界面push到B界面,B界面再pop回A界面,可以给A界面传值或者告诉A刷新界面.
事件监听
事件监听类似于iOS原生的通知,一个发,一个收即可.
A界面收:
import {
DeviceEventEmitter
} from 'react-native';
componentDidMount() {
//收到监听
this.listener = DeviceEventEmitter.addListener('通知名称',(e)=>{
alert(e)
});
}
componentWillUnmount(){
// 移除监听
this.listener.remove();
}
B界面在pop回A界面的时候发:
import {
DeviceEventEmitter
} from 'react-native';
pop = ()=>{
let value = '监听' //准备一个值
DeviceEventEmitter.emit('通知名称',value); //发监听
this.props.navigator.pop({ })
}
事件回调
A界面在push到B界面的时候定义个回调函数
push = () =>{
this.props.navigator.push({
component:DetailsView,
passProps:{
callback:(msg)=>{ alert(msg) }
}
})
}
B界面在pop回A界面的时候调用该回调函数
pop = () =>{
this.props.navigator.pop({
})
if(this.props.callback){
this.props.callback('回调')
}
}
大致效果:
github: https://github.com/pheromone/react_native_callback_emitter