flexDirection为“行”时，ReactNative TouchableWithoutFeedback按下检测功能处于关闭状态，这是为什么？

Question

假设我有一个带有底部水平条的应用程序。

此栏用于导航，并包含在呈现如下内容的组件内...

<View style={[styles.container, this.props.style]}>
    {this.props.children}
</View>

styles.container看起来像这样...（this.props.style没关系）

const styles = StyleSheet.create({
    container: {
        flexDirection: 'row' // if column this works normally
    }
});

每个通过{this.props.children}传递到容器的孩子看起来像这样...

<View
    style={{
        opacity: this.props.page === PAGES.HOME ? 1 : 0.4,
        flex: 1,
        backgroundColor: `red`
    }}>
    <TouchableWithoutFeedback onPress={this.navigate.bind(this, 0)}>
        <View style={[styles.iconContainer, styles.iconBottom]}>
            <Image
                style={{height: 24}}
                resizeMode="contain"
                source={flashlight}
            />
            <Text
                style={[
                    this.props.primaryText,
                    {fontSize: 12, paddingTop: 4}
                ]}>
                Receive
            </Text>
        </View>
    </TouchableWithoutFeedback>
</View>

当TouchableWithoutFeedback以“行”格式显示时，按它时，事情将无法正常工作...

例如，当我按下“学习” ...

该应用程序导航到“关于”

当我将flexDirection: 'row'更改为flexDirection: 'column'时，TouchableWithoutFeedback组件完全按预期工作。

这是ReactNative flexDirection的问题还是我错过了什么？

编辑：

我将TouchableWithoutFeedback更改为TouchableHighlight，当我按“学习”时，它注册的是按“关于”。