I have a TabBar based application in React Native. Multiple tabs use the same data source (AsyncStorage). If I update the data in one tab and open another, the old data is displayed. I cannot figure out how to force a reboot every time an item becomes active.
- FavoritesView: display saved data
- ExploreView: Manipulating Stored Data
FavoritesView: expired data is displayed (-> force reboot)
<TabBarIOS.Item
title="Explore"
icon={{uri:'ic_explore'}}
selected={this.state.selectedTab === 'exploreTab'}
onPress={() => {
this.setState({
selectedTab: 'exploreTab'
});
}}>
<ExploreView/>
</TabBarIOS.Item>
<TabBarIOS.Item
title="Favorites"
icon={{uri:'ic_favorite_border'}}
selected={this.state.selectedTab === 'favoriteTab'}
onPress={() => {
this.setState({
selectedTab: 'favoriteTab'
});
}}>
// Reload this
<FavoritesView/>
</TabBarIOS.Item>
<TabBarIOS.Item
systemIcon="more"
selected={this.state.selectedTab === 'moreTab'}
onPress={() => {
this.setState({
selectedTab: 'moreTab'
});
}}>
<MoreView/>
</TabBarIOS.Item>
I already tried to set a new state to start the update, but it does not change anything.
<TabBarIOS.Item
title="Favorites"
icon={{uri:'ic_favorite_border'}}
selected={this.state.selectedTab === 'favoriteTab'}
onPress={() => {
this.setState({
selectedTab: 'favoriteTab',
forceUpdate: Math.random()
});
}}>
<FavoritesView forceUpdate={this.state.forceUpdate}/>
</TabBarIOS.Item>
purii source
share