react-native-video [android] undefined不是对象(评估NativeModuels.UIManager.RCTVideo.Constants')

时间:2017-03-30 23:46:05

标签: android react-native

我将现有的Android应用程序原生反应,我试图使用react-native-video组件在应用程序上显示视频。

  • React-native:0.42.0
  • react-native-video:1.0.0

我按照此处的说明操作:https://github.com/react-native-community/react-native-video

在MainApplication.java上我添加了这个:

import com.brentvatne.react.ReactVideoPackage;
....
@Override
    public List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
                new MainReactPackage(),
                new ReactVideoPackage()
        );
}

我将此添加到我的settings.gradle(仅限应用中的一个)

include ':react-native-video'
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android')

在我的android / app / build.gradle

compile project(':react-native-video')

在我的反应本机组件上:

import Video from 'react-native-video';
....
render() {
return (
  <View>
  <Video source={{uri: 'https://vjs.zencdn.net/v/oceans.mp4'}} resizeMode="cover" repeat={true}  />
....

react native组件正确构建,但最终在黄色屏幕上显示此警告,而不是其他任何内容:

Possible Unhandled Promise Rejection (id: 0):
             undefined is not an object (evaluating '_reactNative.NativeModules.UIManager.RCTVideo.Constants')
             render@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:46677:73
             http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12555:27
             measureLifeCyclePerf@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12015:14
             _renderValidatedComponentWithoutOwnerOrContext@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12554:45
             _renderValidatedComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12575:78
             performInitialMount@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12227:55
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12130:40
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             mountChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11615:56
             initializeChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:9929:41
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:10012:28
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             performInitialMount@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12235:48
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12130:40
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             performInitialMount@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12235:48
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12130:40
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             performInitialMount@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12235:48
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12130:40
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             mountChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11615:56
             initializeChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:9929:41
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:10012:28
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             performInitialMount@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12235:48
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:12130:40
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             mountChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11615:56
             initializeChildren@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:9929:41
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:10012:28
             mountComponent@http://localhost:8081/reactnative/wall.bundle?platform=android&dev=true&hot=false&minify=false:11170:49
             performInitialMount@http://localhost:8081/reactnati

谢谢!

2 个答案:

答案 0 :(得分:0)

修复了在创建ReactInstanceManager

时添加ReactVideoPackage的问题
mReactInstanceManager = ReactInstanceManager.builder()
            .setApplication(getApplication())
            .setBundleAssetName("index.android.bundle")
            .setJSMainModuleName("index.android")
            .addPackage(new MainReactPackage())
            .addPackage(new ReactVideoPackage())//<-- this line fixed
            .setUseDeveloperSupport(BuildConfig.DEBUG)
            .setInitialLifecycleState(LifecycleState.RESUMED)
            .build();

答案 1 :(得分:0)

enter image description here

enter image description here

cd ios和pod安装   并再次链接库

textView.setText(Html.fromHtml("<h2>Title</h2><br><p>Description here</p>", Html.FROM_HTML_MODE_COMPACT));

注意-react-native链接react-native-video

enter image description here