React Native - webview 内外通信

在React Native中，WebView组件可以用来加载网页。为了实现WebView与React Native间的内外通信，可以使用WebView的onMessage属性来接收来自网页的消息，以及使用postMessage方法来向网页发送消息。

以下是一个简单的例子：

import React, { useRef } from 'react';
import { View, WebView } from 'react-native';
 
const MyWebView = () => {
  const webview = useRef(null);
 
  const handleMessage = (event) => {
    const { nativeEvent } = event;
    console.log('Received message from webview:', nativeEvent.data);
  };
 
  const sendMessageToWebView = () => {
    webview.current.postMessage('Hello from React Native!');
  };
 
  return (
    <View style={{ flex: 1 }}>
      <WebView
        ref={webview}
        source={{ uri: 'https://yourwebsite.com' }}
        onMessage={handleMessage}
      />
      <Button title="Send Message" onPress={sendMessageToWebView} />
    </View>
  );
};
 
export default MyWebView;

在网页中，可以使用window.postMessage方法向React Native发送消息，并且在React Native中通过onMessage属性接收消息。

确保网页代码中正确地使用了postMessage方法，并且在React Native中正确处理了onMessage事件。这样，你就可以在React Native和WebView之间实现双向通信了。