当视频在 expo-video-player 上以 react native 结束时如何提醒某些东西？答案

【问题标题】：How to alert something when the video ends on expo-video-player on react native?当视频在 expo-video-player 上以 react native 结束时如何提醒某些东西？
【发布时间】：2021-06-27 01:46:13
【问题描述】：

带有自定义控件的 expo-video-player 存储库对我非常有帮助 (this is the link of the repo I based from)。我想知道如何制作一个功能，让我可以在视频结束时执行某些操作（例如警报“视频结束”）。

代码：这是我迄今为止尝试过的：

const updatePlaybackCallback = (status: AVPlaybackStatus) => {
 props.playbackCallback(status)
   if (status.didJustFinish){
     alert('END!');
   }
}

return (
 <View style={styles.container}>
   <VideoPlayer
     videoProps={{
       shouldPlay: false,
       resizeMode: Video.RESIZE_MODE_COVER,
       source: {
         uri: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
       },
       ref: refVideo2,
     }}
     onPlaybackStatusUpdate={updatePlaybackCallback}
     fullscreen={{
       inFullscreen: isFullscreen,
       enterFullscreen: async () => {
         setStatusBarHidden(true, 'fade')
         setFullscreen(true)
         await ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE_RIGHT)
       },
       exitFullscreen: async () => {
         setStatusBarHidden(false, 'fade')
         setFullscreen(false)
         await ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.DEFAULT)
       },
     }}
     style={{
       videoBackgroundColor: 'black',
       height: isFullscreen ? Dimensions.get('window').width : 160,
       width: isFullscreen ? Dimensions.get('window').height : 320,
     }}
   />
 </View>

我也试过这些，但它什么也没做：

_onPlaybackStatusUpdate = playbackStatus => {
 if (playbackStatus.durationMillis === playbackStatus.positionMillis)
 alert('END!')
 console.log('end')
};

return (
 <View style={styles.container}>
   <VideoPlayer
     videoProps={{
       shouldPlay: false,
       resizeMode: Video.RESIZE_MODE_COVER,
       source: {
         uri: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
       },
       ref: refVideo2,
     }}
     onPlaybackStatusUpdate={(playbackStatus) => this._onPlaybackStatusUpdate(playbackStatus)}

和

_onPlaybackStatusUpdate = playbackStatus => {
 if (playbackStatus.didJustFinish)
   alert('END!');
};

return (
 <View style={styles.container}>
   <VideoPlayer
     videoProps={{
       shouldPlay: false,
       resizeMode: Video.RESIZE_MODE_COVER,
       source: {
         uri: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
       },
       ref: refVideo2,
     }}
     onPlaybackStatusUpdate={(playbackStatus) => this._onPlaybackStatusUpdate(playbackStatus)}

【问题讨论】：

标签： react-native expo expo-av

【解决方案1】：

而不是updatePlaybackCallback、onPlaybackStatusUpdate 等...

您是否尝试编写playbackCallback（不是调用它，而是实现它）？

Function which is fired every time onPlaybackStatusUpdate occurs

https://github.com/ihmpavel/expo-video-player/blob/master/lib/props.tsx#L15

https://github.com/ihmpavel/expo-video-player#props

【讨论】：

谢谢！播放回调解决了我的问题