您好我正在使用React Native处理学校项目的应用程序,并且无法让iframe工作。我一直在处理的代码如下。
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View,
DeviceEventEmitter,
StatusBar,
DrawerNavigator,
Button,
WebView,
} from 'react-native';
import Iframe from 'react-iframe'
var s = require('./style');
const VideoPage = (props) => {
const { navigate } = props.navigation;
return (
<View>
<View style={s.container}>
<StatusBar
backgroundColor="black"
barStyle="light-content"
/>
</View>
<View>
<Text style={s.headText}>
Welcome the video tutorial page!
</Text>
<Button
onPress={() => navigate('Home')}
title="Go to Home"
/>
</View>
<Iframe url="http://www.youtube.com/embed/xDMP3i36naA"
width="450px"
height="450px"
id="myId"
className="myClassname"
display="initial"
position="relative"
allowFullScreen/>
</View>
);
}
VideoPage.navigationOptions = {
title: 'Video Tutorials',
};
export default VideoPage`
当我在我的虚拟设备上编译它时,但是当我尝试访问VideoPage时,我收到以下错误:
Invariant Violation: View config not found for name iframe
如果有人可以看看,让我知道我做错了什么,我将非常感激。如果您需要更多信息,请与我们联系。
答案 0 :(得分:3)
react-iframe不是反应原生成分。
您应该使用WebView。
https://www.quora.com/How-do-I-integrate-iframes-in-React-Native-platform