您好,我正在使用 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 时,我收到以下错误:
不变违规:未找到名称 iframe 的 View 配置
如果有人可以看一下并让我知道我做错了什么,我将不胜感激。如果您需要更多信息,请告诉我。
最佳答案
react-iframe 不是 React 原生组件。
您应该改用 WebView。
https://www.quora.com/How-do-I-integrate-iframes-in-React-Native-platform
关于javascript - react 原生 iframe,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49418425/