未触发 React Native WebView onMessage()答案

【问题标题】：React Native WebView onMessage() is not triggered未触发 React Native WebView onMessage()
【发布时间】：2021-09-27 18:31:52
【问题描述】：

我在 S3 上托管了一个静态站点，上面有 CloudFront 发行版。

<WebView
  ref={webViewRef}
  scrollEnabled={false}
  source={{ uri: Config.REMOTE_URL }} // CloudFront URL
  sharedCookiesEnabled={true}
  onMessage={(event) => receivedMessageFromWebView(event.nativeEvent.data)}
/>

我们postMessage() 上网的方式是这样的

const sendDataToWebView = (dataMap: any) => {
  const dataToPost = { type: 'data', data: dataMap };
  const postMessageJSCode = `
    window.postMessage(${JSON.stringify(dataToPost)}, "*");
    true;
  `;
  if (webViewRef && webViewRef.current) {
    webViewRef.current.injectJavaScript(postMessageJSCode);
  }
}

而onMessage的实现如下

const receivedMessageFromWebView = (msgData: any) => {
  console.log('Data Received from WebView -->', msgData); // <-- Not working
};

我在这里错过了什么？

反应：17.0.2
ReactNative：0.64.2
Web 视图：11.6.5

【问题讨论】：

标签： typescript react-native webview postmessage react-native-webview