在ReactNative 做移动端开发时,用TabNavigator实现标签时,在两个标签之间切换时,无法实现页面的刷新。正如网上所提的问题: “如果2个tabbar 里面的 list数据是对应的,比如 一个是 货物list, 一个是 上架货物的list , 在一个list里面点击了某件货物上架, 那应该在 上架货物list里面多一件,但发现tab之间的切换不会刷新重读页面”。
这时,我们可以用“DeviceEventEmitter”这个ReactNative所提供的组件。
就拿上面那个问题 做例子:
首先,我们先在货物list 和上架货物list 页面内添加:
import {
DeviceEventEmitter,
} from 'react-native';
componentDidMount(){
this.listener = DeviceEventEmitter.addListener('NoticeName', (value)=>{
//这里面是要调用的方法,比如:刷新
//value:是下面页面在 通知 时 ,所传递过来的参数
});
};
//在组件销毁的时候将其移除
componentWillUnmount(){
this.listener.remove();
};
然后我们在点开一个货物后的,也就是货物操作页面,添加:
import {
DeviceEventEmitter,
} from 'react-native';
在你操作完该货物后,该货物状态改变后,添加
DeviceEventEmitter.emit('NoticeName',param);
这里的param为你想传递的参数;name为上面货物list和上架货物list里面的name,
这里就是依靠这个NoticeName,来通知其他页面中的DeviceEventEmitter.addListener中名字为NoticeName的监听方法