android ReactNative 调用 JS方法

React Native提供了一个名为`WebView`的组件，可以用来加载并运行HTML页面，并且可以与HTML页面中的JavaScript代码进行交互。使用WebView可以实现在React Native中调用JavaScript方法的功能，具体步骤如下：

1. 安装WebView组件：在React Native项目中执行`npm install react-native-webview`命令安装WebView组件。

2. 导入WebView组件：在需要使用WebView组件的文件中，使用`import { WebView } from 'react-native-webview';`语句导入WebView组件。

3. 在render()方法中使用WebView组件：使用`<WebView />`标签创建一个WebView组件，并设置`source`属性为HTML页面的URL或者本地文件路径。

4. 在JavaScript中定义需要调用的方法：在HTML页面中定义需要调用的JavaScript方法，并使用`window.ReactNativeWebView.postMessage()`方法向React Native发送消息。

5. 在React Native中调用JavaScript方法：使用WebView组件的`injectJavaScript()`方法向WebView中注入JavaScript代码，调用在HTML页面中定义的方法。

示例代码如下：

import React, { Component } from 'react';
import { WebView } from 'react-native-webview';

class MyWebView extends Component {
  onMessage = (event) => {
    const { data } = event.nativeEvent;
    // 收到HTML页面发送的消息
    console.log(data);
  }

  render() {
    return (
      <WebView
        source={{uri: 'https://example.com'}}
        onMessage={this.onMessage}
      />
    );
  }
}

export default MyWebView;

HTML页面代码：

<button onclick="sendMessage()">发送消息</button>
<script>
  function sendMessage() {
    window.ReactNativeWebView.postMessage('Hello from HTML!');
  }
</script>

在React Native中调用HTML页面中的`sendMessage()`方法：

webViewRef = React.createRef();

// 在componentDidMount()方法中获取WebView组件的引用
componentDidMount() {
  this.webViewRef.current.injectJavaScript(`
    sendMessage();
  `);
}

上述代码通过在HTML页面中定义了一个`sendMessage()`方法，并使用`window.ReactNativeWebView.postMessage()`方法发送消息到React Native中。在React Native中使用`injectJavaScript()`方法向WebView中注入JavaScript代码，调用HTML页面中的`sendMessage()`方法，从而实现了React Native调用JavaScript方法的功能。