1

如何在 react native 中实现选项卡导航器内的计数。下面是示例图像。我问过反应社区，但似乎没有人对此有答案。请帮忙。 在此处输入图像描述

4

2 回答 2

0

您在这里有两个选择：

1.使用 redux 或其他东西，以便您的选项卡组件知道自己的计数，而不管路由如何。

2.你可以有一个像badgeCount这样的参数，这是可见的，因为tabBar或任何其他导航选项可以定义为导航道具的功能：

static navigationOptions = {
        tabBar: (navigation) => ({
            label: 'Home',
            icon: ({ tintColor, focused }) =>
                <IconBadge
                MainElement={
                    <Ionicons
                    name={focused ? 'ios-home' : 'ios-home-outline'}
                    size={26}
                    style={{ color: tintColor }}
                    />
                }
                badgeNumber={navigation.state.params.badgeCount}
            />,
        }),
    }

然后您可以通过调用 navigation.setParams({ badgeCount: 123 }) 来更改参数。

这已在此Github 问题中得到解决

于 2017-07-12T06:32:52.863 回答
0

在您过去的页面中：

static navigationOptions = ({navigation}) => ({
  title: 'yourTitle',
  tabBarLabel: 'Past${navigation.state.params.count}'
})

通过 setParams 方法更改计数后，它将显示新计数：

navigation.setParams({count: list.length})
于 2017-07-12T06:52:09.007 回答