React-Native-Video如何添加onPress？

Question

我正在构建与视频连接的移动应用程序，更像是snapchat discover。我想添加onPress功能的视频，所以当用户将按下它，它将只是转到下一个视频。

所以我像这样渲染视频。

return (
  <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
    {this.state.buffering && <ActivityIndicator size="large"/>}
    {this.video()}
  </View>
);

但当我尝试将Touchableopacity添加到它以能够按下到视频时，视频不可见。我听到了视频的声音，但看不见。

return (
  <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
    {this.state.buffering && <ActivityIndicator size="large"/>}
    <TouchableOpacity onPress={this.continue.bind(this, 1)}>
      {this.video()}
    </TouchableOpacity>
  </View>
);

和视频功能：

return (
  <Video
    source={{uri: 'http://' + this.state.videos[this.state.plamount].video_path}}
    resizeMode="cover"
    paused={this.state.pause}
    style={StyleSheet.absoluteFill}
    onLoad={() => this.setState({buffering: false})}
    repeat={true}
    onError={() => Actions.reset('main')}
  />
)

Answer 1

好吧，我找到了答案。也可以有其他的答案，但是，当我改变

从…

return (
  <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
    {this.state.buffering && <ActivityIndicator size="large"/>}
    {this.video()}
  </View>
);

至

<TouchableOpacity onPress={this.continue.bind(this, 1)} style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
   {this.state.buffering && <ActivityIndicator size="large"/>}
   {this.continue()}
</TouchableOpacity>

它成功了..。但不管怎样，仍然有一个问题，为什么视频是不可见的，如果视频周围还有一个包装器呢？