javascript - react 原生 iframe

Question

您好，我正在使用 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 配置

如果有人可以看一下并让我知道我做错了什么，我将不胜感激。如果您需要更多信息，请告诉我。

Answer 1

react-iframe 不是 React 原生组件。

您应该改用 WebView。

https://www.quora.com/How-do-I-integrate-iframes-in-React-Native-platform