Reactnative React Native WebView onMessage 没有做任何事情

发布于12月03日

我正在try 使用onMessage侦听器.该网站正在执行postMessage(window.postMessage("Post message from web");)，但react native的webview onMessage listener没有执行任何操作！我不知道我做错了什么.

这是HTML

<script type="text/javascript">
  window.postMessage("Post message from web");
</script>

下面是react-native 代码:

  <WebView
    ref={( webView ) => this.webView = webView}
    onMessage={this.onMessage}
    source={{uri: 'https://app.sodge.co/login/response.html'}}
  />

onMessage react-native 函数:

onMessage( event ) {
  Alert.alert(
    'On Message',
    event.nativeEvent.data,
    [
      {text: 'OK'},
    ],
    { cancelable: true }
  )
}

这里还有expo 小吃...我不知道我做错了...

推荐答案

根据this issue，您需要等到React Native postMessage替换了Native window.postMessage(不要问我why他们正在替换一个本机函数，而不是创建一个新函数).

一种解决方案是采取以下措施:

function waitForBridge() {

   //the react native postMessage has only 1 parameter
   //while the default one has 2, so check the signature
   //of the function

   if (window.postMessage.length !== 1){
     setTimeout(waitForBridge, 200);
   }
   else {
     window.postMessage('abc');
   }
}

window.onload = waitForBridge;