Question

我已经成功地将消息从React Native（RN）发送到WebView。

我正在努力的是，将消息从WebView传回RN。没有错误显示-只是消息永远不会通过。

这是我正在使用的代码：

反应本机代码

<WebView
  ref={webview => (this.webview = webview)}
  source={{ uri: "http://www.my-web-site"}}
  onLoadEnd={() => this.onLoadEnd()}
  onMessage={this.onMessage}
  cacheEnabled={false}
  originWhitelist={['*']}
  javaScriptEnabled={true}
/>

onLoadEnd() {
  this.webview.postMessage("RN message");
}

onMessage(message) {
  console.log("I can’t see this message!");
}

WebView代码

document.addEventListener("message", function (event) {
  setTimeout(function(){document.postMessage("WebView message")}, 3000);
}, false);

非常感谢。

Answer 1

请确保已插入每个接收器的数据，并使用所需的数据。

在使用它们之前，请务必先检查规定的文档以了解如何使用参数和语法。

RN

<button type="button" class="mt-2 btn btn-secondary" (click)="onButtonClick(imagenPortada)">Ver detalles</button>

WebView代码

onLoadEnd() {

  this.webview.postMessage("sendmessage");
}

onMessage(event) {
  alert(event.nativeEvent.data);
}

Answer 2

哦，终于，我终于找到答案了。这是我最初试图用来将消息从RN发送到WebView的一行代码。原来，这是从WebView发送到RN所需的代码：

WebView代码

document.addEventListener("message", function (event) {
  window.ReactNativeWebView.postMessage(event.data);
}, false);

如何从WebView发送消息到React Native？

2 个答案: