Question

我有一个项目列表，每行都有一个视频网址。我在视频视图中使用了React-Native-Video组件。

<TouchableOpacity
         style={styles.fullScreen}
         onPress={() => this.setState({ paused: !this.state.paused })}
 >
   <Video source={{ uri: rowData.podcastUrl }}   // URL
        ref={(ref) => {
 // Store reference
        this.player = ref
         ......
         ......                           
     }}  
   paused={true}                                   
  </TouchableOpacity>

上面的代码位于renderMyList（）函数内部，该函数在每行的渲染时调用。

当我加载我的UI时，所有视频都处于播放模式或基于“暂停”状态为假或无效而停止（无论我在上面传递的是什么。但我想正确处理单个视频的播放/暂停（列表项）我保持了一个暂停状态变量。

请提供一些示例代码。

Answer 1

如果您计划在任何特定时刻只播放一个视频，则可以执行以下操作

requests per second

并检查该视频是否正在播放

onPress={() => { this.setState({ playing: 'someUniqueIdForThisVideo'}) }}

如果您想播放多个视频，可以执行以下操作

paused={this.state.playing !== 'videoIdOrSomething'}

并检查下面的状态

onPress={() => { this.setState({ ['someUniqueIdForThisVideo']: true}) }}

这只是为了给你一个粗略的想法。如果已经播放状态，你需要实现某种逻辑来将状态设置为false。

如何在react-native中处理列表视图中的视频视图回放

1 个答案: