如何在topBar React Native Navigation下添加可点击的rightButtons？

Question

我已经集成了 React Native 导航包。我想在我的 topBar rightButton 上添加带有动态值的徽章。包的 Github 链接：：https : //github.com/wix/react-native-navigation

我想要这样的输出。您可以查看此屏幕截图::

问题：：

如果我在通知图标上添加计数值，那么当我尝试单击按钮时不会发生任何事件。单击此按钮后，我想打开通知屏幕。

代码：

static options({ menuIcon }) {
        return {
            topBar: {
                title: {
                    fontFamily: font,
                    fontSize: fontSize.heading,
                    color: colors.white,
                    alignment: 'center',
                    text: strings.dashboard
                },
                alignment: 'center',
                elevation: 0,
                noBorder: true,
                background: {
                    color: colors.dark
                },
                leftButtons: [
                    {
                        id: 'openSideMenu',
                        icon: menuIcon ? menuIcon : APIURLServiceSingleton.getInstance()._menuIcon
                    }
                ],
                rightButtons: [
                    {
                        id: 'notificationButton',
                        component: {
                            name: 'component.notificationButton'
                        }
                    }
                ]
            }
        }
    }

我的自定义组件的代码::

<TouchableOpacity
    onPress={() => this.openSystemAlerts()}
    style={{ position: 'absolute', right: 0, bottom: -13 }}
>
    <View style={styles.button}>
        <View style={[posRelative]}>
            <Icon
                name="notifications-none"
                size={27}
                color={colors.white}
            />
            {(unseen_count && unseen_count > 0) &&
                <Text style={styles.badge}>{unseen_count}</Text>
            }
        </View>
    </View>
</TouchableOpacity>

环境

• 反应原生导航版本：2.12.0
• 反应本机版本：0.58
• 平台：仅 IOS（版本 10.0）

Answer 1

看来，position:'absolute'正在制造问题，

任何一个 ，

添加zIndex:2...此处，数字必须大于zIndex其父级中的任何其他数字，或者如果没有zIndex使用任何数字，则任何数字> 0 都可以。

或者

取下position:'absolute'并尝试不使用它的造型。