未反映合并选项更改

Question

I'm trying to get a badge to display on one of the navigation tabs.

 onClickSetBadge() { console.log('Button pressed!') Navigation.mergeOptions(this.props.componentId, { bottomTab: { badge: `TeSt` } }); }

I'm calling it inside the view I'm rendering.

 <ButtonView text='SUP' onPress={() => {this.onClickSetBadge()}} />

The log statement shows up in my console, however, the badge is not shown.

Answer 1

According to the official document: https://wix.github.io/react-native-navigation/#/docs/layout-types?id=updating-options-for-a-specific-tab , that is how it works:

1) Define an id for the specific tab:

    stack: {
      id: 'CartTab',
      children: [{
        component: {
          name: 'store-cart',
        }
      }],
      options: {
        bottomTab: {
          text: 'Cart',
          icon: require('../asset/image/menu/cart.png'),
        }
      }
    }

2) Use the tab id to update when needed:

  Navigation.mergeOptions('CartTab', {
    bottomTab: {
      badge: cart.length > 0 ? cart.length.toString() : ''
    }
  });