带有 Expo Video 组件的 useNativeControl 导致应用程序崩溃答案

【问题标题】：useNativeControl with Expo Video component causing app to crash带有 Expo Video 组件的 useNativeControl 导致应用程序崩溃
【发布时间】：2017-08-21 19:22:06
【问题描述】：

您好，我正在尝试将视频与 React Native 一起使用，并且遇到了 Expo Video Component（请参阅 https://docs.expo.io/versions/v14.0.0/sdk/video.html），当我使用 create-react-native-app 来设置我的应用程序时，我认为这将是一个不错的选择。但是，当我将“useNativeControl”添加到我的视频组件时，它会导致我的应用程序崩溃。

这里是一些带有 useNativeControl 的代码：//只显示控件一秒钟，然后在退出应用程序之前说“Expo 已停止”

import React, { Component } from 'react';
import { StyleSheet, Text, View, Image, Button } from 'react-native';
import { Video } from 'expo';

    export default class App extends Component {
      render() {
        return (
          <View style={styles.app}>
           <Video  source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }} rate={1.0} volume={1.0} useNativeControls muted={false}  resizeMode="cover"  shouldPlay isLooping style={{ width: 300, height: 300 }} />
           </View>
        );
      }
    }

这是没有它的代码：

  import React, { Component } from 'react';
    import { StyleSheet, Text, View, Image, Button } from 'react-native';
    import { Video } from 'expo';

export default class App extends Component {
  render() {
    return (
      <View style={styles.app}>
        <Header />
        <Topics />
                <Video  source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }} rate={1.0} volume={1.0} muted={false}  resizeMode="cover"  shouldPlay isLooping style={{ width: 300, height: 300 }} />
      </View>
    );
  }

所以你可以看到唯一的区别是“useNativeControls”，没有 useNativeControls 应用程序可以正常工作，我只是在视频上没有任何控件。

主要问题：如何使用原生控件而不让我的应用崩溃？

旁注/问题：或者，是否有其他适合 react-native 初学者使用的视频播放器？我已经为此花费了几个小时，但还没有提出解决方案。我最初尝试过 react-native-video (https://www.npmjs.com/package/react-native-video)，但这对我不起作用（从文档来看，它需要您更改 java 代码，这不是我想做的事情）。因此，如果有一种替代 expo 的视频组件的方法，它具有控件并且无需任何 java/swift 知识即可工作，这就是我正在寻找的。p>

编辑：

package.json 依赖：

  "dependencies": {
    "expo": "^20.0.0",
    "link": "^0.1.5",
    "react": "16.0.0-alpha.12",
    "react-native": "^0.46.4",
    "react-native-video": "^2.0.0",
  }

【问题讨论】：

标签： react-native expo

【解决方案1】：

您是否退出/分离了您的应用程序？该库需要将一些本机代码添加到项目中。您不能将其与即插即用方法一起使用。在此处阅读有关分离的更多信息：https://docs.expo.io/versions/latest/guides/detach.html

但请注意，一旦您开始为自己构建应用程序，这就是一个狂野的世界。我现在一个人在那里，并且非常失败。我怀疑你能找到任何不需要添加本机代码的视频播放器。

【讨论】：