react native webview window.reactnativewebview.postmessage
时间: 2023-12-26 21:25:49 浏览: 191
`window.ReactNativeWebView.postMessage(message)`是React Native WebView组件中用于向WebView发送消息的方法。如果你在React Native中使用WebView组件,可以通过在WebView中注入JavaScript代码来调用该方法。具体实现步骤如下:
1. 在WebView中注入JavaScript代码,代码如下:
```javascript
<WebView
source={{ uri: 'https://www.example.com' }}
onMessage={event => console.log(event.nativeEvent.data)}
injectedJavaScript={`const message = "Hello, world!"; window.ReactNativeWebView.postMessage(message);`}
/>
```
上述代码中,我们在WebView中注入了一段JavaScript代码,该代码会在WebView加载完成后立即执行。该代码会向WebView发送一条消息,消息内容为"Hello, world!"。
2. 在WebView中监听onMessage事件,代码如下:
```javascript
<WebView
source={{ uri: 'https://www.example.com' }}
onMessage={event => console.log(event.nativeEvent.data)}
injectedJavaScript={`const message = "Hello, world!"; window.ReactNativeWebView.postMessage(message);`}
/>
```
上述代码中,我们在WebView中监听了onMessage事件,并在事件处理函数中打印出了接收到的消息内容。
当WebView接收到来自JavaScript代码的消息时,会触发onMessage事件,并将消息内容作为参数传递给事件处理函数。在上述代码中,我们只是简单地将消息内容打印出来,你可以根据实际需求进行处理。
阅读全文