问题
I try to find any way to add Iframe to my react native app. I found react-iframe, but it didn't work for me. I followed document. I just import react-iframe and copy Iframe tag to use. My result is like image below.
I need other way to use Iframe in react native app. Thank you.
回答1:
Try to use WebView:
import { WebView } from 'react-native';
....
<WebView
scalesPageToFit={true}
bounces={false}
javaScriptEnabled
style={{ height: 500, width: 300 }}
source={{
html: `
<!DOCTYPE html>
<html>
<head></head> // <--add header styles if needed
<body>
<div id="baseDiv">${iframeString}</div> //<--- add your iframe here
</body>
</html>
`,
}}
automaticallyAdjustContentInsets={false}
/>
I use it to display different web content including iframes and it works great.
https://facebook.github.io/react-native/docs/webview
回答2:
I answer on my question.
I used webview for display Iframe.
<WebView
source={{html: '<iframe width="100%" height="50%" src="https://www.youtube.com/embed/cqyziA30whE" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>'}}
style={{marginTop: 20}}
/>
来源：https://stackoverflow.com/questions/52907052/how-to-use-iframe-in-react-native