Javascript 如何使用react本机视频反向播放视频？

我想播放15秒的视频。首先，我想以简单的顺序播放视频，15秒后我想以相反的顺序播放视频。 在下面的代码中，我从本地文件获取视频并在react native video中播放。我想播放Instagram自食其果选项的视频。我还尝试了将react native video选项的seek选项设置为backward，但它不起作用。请帮我解决这个问题。 这是我的密码：-

 import React, { Component } from 'react';
 import Modal from 'react-native-modal';
 import { Avatar, Button, Icon } from 'react-native-elements';
 import ImagePicker from 'react-native-image-picker';
 import Video from 'react-native-video';

 export default class VideoPickAndUpload extends Component {

 constructor(props) {
    super(props);
    this.state = {
        videoUri : null,
        paused : false,
        repeat : false,
        rate : 1,
        volume : 1,
        resizeMode : 'contain',
        duration : 0.0,
        currentTime : 0.0,
        rateText : 0.0,
        pausedText : 'Play',
        controls : true,
        playIcon : 'controller-paus'        
    };
}   


//video Select from camera or gallery
onSelectVideo = () => {
    ImagePicker.showImagePicker({title:'Select Video',
        takePhotoButtonTitle : 'Make Video',
        maxHeight:800,maxWidth:800,
        mediaType:'video',cropping:true},
        video => {
            if(video.didCancel){
                ToastAndroid.show('Video selecting   
 cancel',ToastAndroid.LONG);
            } else if(video.error){
                ToastAndroid.show('Video selecting error : 
 '+video.error,ToastAndroid.LONG);
            }else {
                ToastAndroid.show('Video path : 
 '+video.uri,ToastAndroid.LONG);
                this.setState({videoUri : video.uri})
            }
          }
        )
    }

//reset Video
onResetVideo = () => {
    this.setState({videoUri : null})
} 

onPress = () => {
    if(this.state.paused == true){
        this.setState({paused:false,playIcon:'controller-
 paus'})
    }else {
        this.setState({paused:true,playIcon:'controller-play'})
    }
}

//load video
onLoad = (data) => {
    this.setState({duration : data.duration})
}

//load current progress
onProgress = (data) => {
    this.setState({currentTime : data.currentTime})
    ToastAndroid.show("Progress : 
 "+data.currentTime,ToastAndroid.LONG);
    if(this.state.currentTime >= 15){
        for(let i=data.currentTime;i>=1;i--){
            this.video.seek(data.currentTime - i )
            ToastAndroid.show("decrease : 
 "+i,ToastAndroid.LONG);
        }
    }
} 

//when reach on end
onEnd = () => {
    this.setState({pausedText : 'Play' ,  playIcon:'controller-
 stop'})
    //this.video.seek(0)
    ToastAndroid.show("End : 
 "+this.state.currentTime,ToastAndroid.LONG);
}

//get current time percentage on progress bar
getCurrentTimePercentage() {
    if(this.state.currentTime > 0){
       return parseFloat(this.state.currentTime) / 
 parseFloat(this.state.duration)
    }
    return 0;
};

render() {

    const {modalVisible,modalClose} = this.props;

    return (
        <Modal 
            animationIn={"bounceInRight"}
            animationOut={"bounceOutRight"}
            animationInTiming={500}
            animationOutTiming={500}
            isVisible={modalVisible}
            onBackButtonPress={modalClose}
        >
            <View style={styles.container}>

                <TouchableWithoutFeedback
                    onPress={() => this.onPress()}
                    style={{borderWidth:2,borderColor:'grey'}}
                >
                    <Video
                        ref={ref => {this.video = ref}}
                        source={{uri: this.state.videoUri}}
                        style={{height:400,width:400}}
                        repeat={this.state.repeat}
                        rate={this.state.rate}
                        volume={this.state.volume}
                        resizeMode={this.state.resizeMode}
                        paused={this.state.paused}
                        onLoad={this.onLoad}
                        onProgress={this.onProgress}
                        onEnd={this.onEnd}
                        controls={this.state.controls} 
                        playWhenInactive={true} 
                    />
                </TouchableWithoutFeedback>
                <View style = 
 {{margin:16,flexDirection:'row'}}>
                    <Icon
                        name='controller-fast-backward'
                        type='entypo'
                        color='#fff'
                        size={36}
                        containerStyle={{padding:16}}
                        onPress={() => 
 {this.video.seek(this.state.currentTime-10)}}
                    />
                    <Icon
                        name={this.state.playIcon}
                        type='entypo'
                        color='#fff'
                        size={36}
                        containerStyle={{padding:16}}
                        onPress={() => this.onPress()}
                    />
                    <Icon
                        name='controller-fast-forward'
                        type='entypo'
                        color='#fff'
                        size={36}
                        containerStyle={{padding:16}}
                        onPress={() => 
 {this.video.seek(this.state.currentTime+10)}}
                    />
                </View>
                <View style = 
 {{margin:16,flexDirection:'row'}}>
                    <Button
                        title="Upload Video"
                        buttonStyle = 
      {{paddingHorizontal:16,paddingVertical:4}} 
                        containerStyle = {{marginRight:8}} 
                        onPress={()=>this.onSelectVideo()}                      
                    />
                    <Button
                        title="Reset Video"
                        buttonStyle = 
      {{paddingHorizontal:16,paddingVertical:4}} 
                        containerStyle = {{marginLeft:8}} 
                        onPress={() => this.onResetVideo()}                      
                    />
                </View>
            </View>
        </Modal>
    );
 }

 }

 const styles = StyleSheet.create({
     container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#212',
  },
 });

import React，{Component}来自'React'；
从“反应本机模态”导入模态；
从“react native elements”导入{Avatar，Button，Icon}；
从“react native image picker”导入ImagePicker；
从“react native Video”导入视频；
导出默认类VideoPickAndUpload扩展组件{
建造师（道具）{
超级（道具）；
此.state={
videoUri:null，
暂停：错，
重复：错，
比率：1，
第1卷，
resizeMode:'包含'，
持续时间：0.0，
当前时间：0.0，
比率文本：0.0，
暂停文字：“播放”，
控制：对，
播放图标：“控制器暂停”
};
}   
//从照相机或多媒体资料中选择视频
onSelectVideo=（）=>{
showImagePicker（{title:'Select Video'，
TakePhotoButton:“制作视频”，
最大高度：800，最大宽度：800，
mediaType:'video'，裁剪：true}，
视频=>{
if（video.didconcel）{
ToastAndroid.show（'视频选择
取消'，ToastAndroid.LONG）；
}else if（video.error）{
ToastAndroid.show（'视频选择错误：
'+video.error，ToastAndroid.LONG）；
}否则{
ToastAndroid.show（'视频路径：
'+video.uri，ToastAndroid.LONG）；
this.setState（{videoUri:video.uri}）
}
}
)
}
//重置视频
onResetVideo=（）=>{
this.setState（{videoUri:null}）
} 
onPress=（）=>{
if（this.state.paused==true）{
this.setState（{暂停：false，播放图标：'controller-
paus'}）
}否则{
this.setState（{暂停：true，播放图标：'controller-play'}）
}
}
//加载视频
onLoad=（数据）=>{
this.setState（{duration:data.duration}）
}
//加载当前进度
onProgress=（数据）=>{
this.setState（{currentTime:data.currentTime}）
ToastAndroid.show（“进度：
“+data.currentTime，ToastAndroid.LONG）；
如果（this.state.currentTime>=15）{
for（设i=data.currentTime；i>=1；i--）{
this.video.seek（data.currentTime-i）
ToastAndroid.显示（“减少：
“+i，ToastAndroid.LONG）；
}
}
} 
//当到达终点时
onEnd=（）=>{
this.setState（{pausedText:'Play'，playIcon:'controller-
停止“}）
//此.video.seek（0）
ToastAndroid.show（“结束：
“+this.state.currentTime，ToastAndroid.LONG）；
}
//获取进度条上的当前时间百分比
getCurrentTimePercentage（）{
如果（this.state.currentTime>0）{
返回parseFloat（this.state.currentTime）/
parseFloat（this.state.duration）
}
返回0；
};
render（）{
const{modalVisible，modalClose}=this.props；
返回(
这是.onPress（）}
样式={{borderWidth:2，borderColor:'grey'}
>
{this.video=ref}}
source={{uri:this.state.videoUri}
样式={{高度：400，宽度：400}
repeat={this.state.repeat}
速率={this.state.rate}
卷={this.state.volume}
resizeMode={this.state.resizeMode}
暂停={this.state.paused}
onLoad={this.onLoad}
onProgress={this.onProgress}
onEnd={this.onEnd}
controls={this.state.controls}
playWhenInactive={true}
/>
{this.video.seek（this.state.currentTime-10）}
/>
这是.onPress（）}
/>
{this.video.seek（this.state.currentTime+10）}
/>
此.onSelectVideo（）}
/>
此.onResetVideo（）}
/>
);
}
}
const styles=StyleSheet.create({
容器：{
弹性：1，
为内容辩护：“中心”，
对齐项目：“居中”，
背景颜色：'#212'，
},
});

使用react-naitive视频处理库处理回飞棒视频