reactjs - react-native-camera 视频捕获在捕获后显示预览错误？

Question

我正在使用 react-native-camera 进行视频捕获。我正在构建一些类似 Snapchat 的故事，当你捕捉到旁边的视频时，它会将你带到可以编辑的视频预览屏幕。在 videoCapturing 屏幕按下开始按钮时，它会返回视频的路径，但在按下停止按钮时，它会返回错误，同时将视频存储到我的设备存储中。我已经发布了两个视频捕获屏幕以及按下停止按钮时出现的错误。视频捕获屏幕的附加代码。

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,Dimensions,Image,TouchableOpacity,TouchableHighlight,Video
} from 'react-native';

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' +
    'Cmd+D or shake for dev menu',
  android: 'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});
import { TabNavigator, StackNavigator } from 'react-navigation';
import Icon from 'react-native-vector-icons/Ionicons';
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
import Camera from 'react-native-camera';

export default class VideoCapture extends Component {
	
  static navigationOptions = { 
        headerTintColor: 'white',
        headerStyle:{ position: 'absolute', backgroundColor: 'transparent', zIndex: 100, top: 0, left: 0, right: 0 } 
      };

  constructor(props) {
    super(props);
    this.state = {
      cameraType : 'back',
      mirrorMode : false,
      path: null,
    };
  }

  takeVid() {
    const option = {};
    this.camera.capture({
      mode: Camera.constants.CaptureMode.video
    })
      .then((data) => {
         console.log(data);
         this.setState({ path: data.path })
     })
      .catch((err) => console.error(err));
  }


  stopVid(){
    this.camera.stopCapture();
  }


  changeCameraType() {
    if(this.state.cameraType === 'back') {
      this.setState({
        cameraType : 'front',
        mirrorMode : true
      })
    }
    else {
      this.setState({
        cameraType : 'back',
        mirrorMode : false
      })
    }
  }

  renderCamera() {
    return (
      <Camera
           ref={(cam) => {
             this.camera = cam;
           }}
           style={styles.preview}
           aspect={Camera.constants.Aspect.fill}
           type={this.state.cameraType}
           captureMode = {Camera.constants.CaptureMode.video}
           mirrorImage={this.state.mirrorMode}
           keepAwake={true}
           >

           <Text style={styles.capture} onPress={this.changeCameraType.bind(this)}>switch</Text>
           <View style={styles.textCircular}><Text style={{color:'#fefefe',fontSize:14}} onPress={this.takeVid.bind(this)}>Start</Text></View>   
           <View style={styles.textCircular1}><Text style={{color:'#fefefe',fontSize:14}} onPress={this.stopVid.bind(this)}>Stop</Text></View>                   
       </Camera>
    );
  }

  renderVideo() {
    return (
      <View>
        <Video source={{ uri: this.state.path }}
           style={styles.preview}
           rate={1.0}
           volume={1.0}
           muted={false}
           resizeMode={"cover"}
           onEnd={() => { console.log('Done!') }}
           repeat={true} 
        />                
        <Text
          style={styles.cancel}
          onPress={() => this.setState({ path: null })}
        >Cancel
        </Text>
      </View>
    );
  }

  render() {
  	const {goBack} = this.props.navigation;
    return (
      <View style={styles.container}>
        {this.state.path ? this.renderVideo() : this.renderCamera()}
      </View>
    );
  }
};



const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#000',
  },
  preview: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'center',
    height: Dimensions.get('window').height,
    width: Dimensions.get('window').width
  },
  capture: {
    width: 70,
    height: 70,
    borderRadius: 35,
    borderWidth: 5,
    borderColor: '#FFF',
    marginBottom: 15,
  },
  cancel: {
    position: 'absolute',
    right: 20,
    top: 20,
    backgroundColor: 'transparent',
    color: '#FFF',
    fontWeight: '600',
    fontSize: 17,
  }
});