search

aksonov / react-native-router-flux

The first declarative React Native router
MIT License
8.98k stars 2.11k forks source link

Show badge number on Tab at Tabbar #1362

Closed williamkuk closed 7 years ago

williamkuk commented 7 years ago

Version

Tell us which versions you are using:

Expected behaviour

This is actual a question instead of an issue, and I searched closed issues but I cant find an answer. Basically I am wondering if scene (when used as tab) supports badge number (I think the answer is no.) From my understanding, even if badge number is supported (or custom compoent), it won't get updated with state changed since router cant be re-rendered via redux connect.

So, is my only option to make my own tabbar component and wire actions for each tab, and only use router to render my first tab?

Thanks in advance.

atlanteh commented 7 years ago

We (my company) actually implemented it.. You need to connect your icon component to redux and it works great..

import YourTabIcon from './YourTabIcon';

const mapStateToProps = state => {return {badgeCount: state.notifications.count};};
const ConnectedYourTabIcon = connect(mapStateToProps)(YourTabIcon);
// ...
<Scene key="yourTab" icon={ConnectedYourTabIcon} hideNavBar>

and in YourTabIcon you can implement your badge :)

williamkuk commented 7 years ago

@atlanteh Thank you! Work like a charm!