React Native WebView not working IOS simulator - react-native

Question

Does the WebView work in IOS simulator?
The code below does not return an error, but also doesn't display anything.
import React, { Component } from 'react';
import { WebView } from 'react-native';
class MyTest extends Component {
render() {
return (
<WebView
source={{uri: 'https://github.com/facebook/react-native'}}
style={{marginTop: 20}}
/>
);
}
}
export default MyTest;
Thanks

Answer 1

WebView work well in my simulator. My code:
<WebView
useWebKit={true}
style={{flex:1}}
source={{uri:url}}
startInLoadingState={true}
renderLoading={()=>(<ActivityIndicator size='large' color={COLOR_STANDARD}
style={{marginTop:100}} />)}>
</WebView>

Answer 2

I want to contribute here for those getting white screen on ios. First the webview is inside scrollview because I have other content. I know it is adviced for webview not to be inside any component. I was battling this for weeks until I came upon James Liu's. I was running it on expo client (ios) and was getting white screen. Here is my code before I saw his answer.
contentContainerStyle={{
flexGrow: 1,
}}>
<WebView
ref={ref => (this.webview = ref)}
source={{uri: currentSite}}
style={{ height:550}}
scrollEnabled={true}
startInLoadingState={true}
onNavigationStateChange={this._onNavigationStateChange.bind(this)}
javaScriptEnabled = {true}
domStorageEnabled = {true}
startInLoadingState={false}
onLoad={() => this.hideSpinner()}
injectedJavaScript={jsCode}
onMessage={event => {
//Html page
const wishData = event.nativeEvent.data;
this._getProductName(wishData);
this._getProductPrice(wishData);
}}
/>
</ScrollView>
All I needed to add is useWebKit={true} and from the documentation it says:
useWebKit->If true, use WKWebView instead of UIWebView. And this props is ios specific. Furthermore, I googled and found that WKWebView is more recent than UIWebView ( I don't know more about this).

Answer 3

For me, the solution was to wrap my component that returned my WebView in a View with a set height OUTSIDE the file with the component that returns my WebView.
The wrapper View with the height should be in the file that component with the WebView was imported into.
It took several takes and prayer but I finally found it out muahahaha!

Answer 4

The real problem is in the property startInLoadingState, you have to set this to true:
<WebView
startInLoadingState={true} />