react-native回到页面刷新数据,离开页面时清除缓存
回到页面刷新:addListener- 订阅导航生命周期的更新React Navigation 将事件发送到订阅了它们的页面组件:willFocus -页面将获取焦点didFocus - 页面已获取到焦点(如果有过渡动画,等过渡动画执行完成后响应)willBlur - 页面将失去焦点didFocus - 页面已获取到焦点(如果有过渡动画,等过渡动画执行完成后响应)利用路由的addLi...
·
回到页面刷新:
addListener- 订阅导航生命周期的更新
React Navigation 将事件发送到订阅了它们的页面组件:
willFocus -页面将获取焦点
didFocus - 页面已获取到焦点(如果有过渡动画,等过渡动画执行完成后响应)
willBlur - 页面将失去焦点
didFocus - 页面已获取到焦点(如果有过渡动画,等过渡动画执行完成后响应)
利用路由的addListener的willFoucus,在回到当前页面时获取数据,可以达到更新视图的效果
this.routerEvent = this.props.navigation.addListener("willFocus", payload => {
this._getData();
});
在离开页面时移除监听事件:remove()
componentWillUnmount() {
this.routerEvent && this.routerEvent.remove();
}
注意:如果该组件是一个子组件,则无法用路由事件
缓存问题(优化、降低成本):
场景:在tab页切换时每次点击标签都会向服务器重新发送一次请求
解决:新建一个数组/对象,在获取数据的时候把数据复制一份,在切换标签页(分发数据)的时候,如果该数组有值,则不需要向服务器发送请求。 在离开页面时,需要把缓存清空,
this.props.navigation.addListener("didBlur", payload => {
this.setState({
detailDataCache: {}
});
});
更多推荐



所有评论(0)