html string #
DeprecatedUse the source prop instead.
true.The amount by which the web view content is inset from the edges of the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}.
DeprecatedUse the source prop instead.
Set this to provide JavaScript that will be injected into the web page when the view loads.
Boolean that determines whether HTML5 audio and video requires the user
-to tap them before they start playing. The default value is true.
Function that is invoked when the WebView load fails.
Function that is invoked when the WebView has finished loading.
Function that is invoked when the WebView load succeeds or fails.
Function that is invoked when the WebView starts loading.
Function that is invoked when the WebView loading starts or ends.
Function that returns a view to show if there's an error.
Function that returns a loading indicator.
Boolean that controls whether the web content is scaled to fit
+to tap them before they start playing. The default value is true.
Function that is invoked when the WebView load fails.
Function that is invoked when the WebView has finished loading.
Function that is invoked when the WebView load succeeds or fails.
Function that is invoked when the WebView starts loading.
A function that is invoked when the webview calls window.postMessage.
+Setting this property will inject a postMessage global into your
+webview, but will still call pre-existing values of postMessage.
window.postMessage accepts one argument, data, which will be
+available on the event object, event.nativeEvent.data. data
+must be a string.
Function that is invoked when the WebView loading starts or ends.
Function that returns a view to show if there's an error.
Function that returns a loading indicator.
Boolean that controls whether the web content is scaled to fit
the view and enables the user to change the scale. The default value
is true.
Loads static html or a uri (with optional headers) in the WebView.
Boolean value that forces the WebView to show the loading view
on the first load.
The style to apply to the WebView.
DeprecatedUse the source prop instead.
Boolean value to control whether DOM Storage is enabled. Used only in @@ -230,6 +234,53 @@ class ScaledWebView extends } } +class MessagingTest extends React.Component { + webview = null + + state = { + messagesReceivedFromWebView: 0, + message: '', + } + + onMessage = e => this.setState({ + messagesReceivedFromWebView: this.state.messagesReceivedFromWebView + 1, + message: e.nativeEvent.data, + }) + + postMessage = () => { + if (this.webview) { + this.webview.postMessage('"Hello" from React Native!'); + } + } + + render(): ReactElement<any> { + const {messagesReceivedFromWebView, message} = this.state; + + return ( + <View style={[styles.container, { height: 200 }]}> + <View style={styles.container}> + <Text>Messages received from web view: {messagesReceivedFromWebView}</Text> + <Text>{message || '(No message)'}</Text> + <View style={styles.buttons}> + <Button text="Send Message to Web View" enabled onPress={this.postMessage} /> + </View> + </View> + <View style={styles.container}> + <WebView + ref={webview => { this.webview = webview; }} + style={{ + backgroundColor: BGWASH, + height: 100, + }} + source={require('./messagingtest.html')} + onMessage={this.onMessage} + /> + </View> + </View> + ); + } +} + var styles = StyleSheet.create({ container: { flex: 1, @@ -404,6 +455,10 @@ exports.examples /> ); } + }, + { + title: 'Mesaging Test', + render(): ReactElement<any> { return <MessagingTest />; } } ];
