Javascript 反应本机、嵌套滚动视图、跨方向滚动

我试图建立一个ListView风格的列表，并使每个列表项在垂直滚动的ListView中水平滚动。我发现ListView在这个用例中永远不会工作，所以我现在使用嵌套的ScrollView，它有更多的控制。父ScrollView在某些样式旁边没有道具或设置，并且每个列表项都有大量约束

我使用此作为我的列表项代码：

<View style={styles.row}>
    <AnimatedScrollView 
      ref={'animatedSwiperRow'}
      horizontal={true}
      automaticallyAdjustContentInsets={false}
      showsHorizontalScrollIndicator={false}
      showsVerticalScrollIndicator={false}
      keyboardDismissMode={'on-drag'}
      scrollEnabled={this.state.scrollEnabled}
      directionalLockEnabled={true}
      style={[{flex: 1, height: 85}, {backgroundColor: bgColor}]}
      onScroll={this._animateScroll.bind(this)}
      scrollEventThrottle={15}
      onMomentumScrollBegin={this.takeAction.bind(this)}>

      <TouchableOpacity onPress={this._handleViewListItem.bind(this)}>

        <View style={styles.contentRow}>
          <Image
            style={styles.traitIcon}
            resizeMode={'contain'}
            source={{uri: this.props.logo_url}} />

          <View style={styles.contentColumn}>
            <Text style={styles.trait}>
              {this.props.effect}
            </Text>

            <Text style={styles.short_summary}>{this.props.short_summary}</Text>
          </View>

          <Image
            style={styles.profileTypeIcon}
            resizeMode={'contain'}
            source={{uri: this.props.logo_url}} />
        </View>

      </TouchableOpacity>

    </AnimatedScrollView>
  </View>

这给我带来了麻烦。到目前为止，我有一个像样的模型可以玩，但是有太多的臭虫。我试图消除的第一个错误是，每个列表项的ScrollView都有垂直滚动的能力，这是一个问题，因为我希望所有垂直滚动都发送到父ScrollView，父ScrollView目前充当我的ListView。所有水平滚动条我只需要水平滑动该行。显然现在不是这样，因为大多数垂直滚动只滚动单个列表项，而不是像我所希望的那样滚动整个列表项

  <View style={styles.container}>
    <ScrollView style={styles.outerScroll}>
      {this.state.dataSource.map(this.renderListItem, this)}
    </ScrollView>
  </View>