Android 调用 JS 传数组

一、流程概述

在Android应用中调用JS函数并传递数组，主要分为以下几个步骤：

  1. 创建一个WebView对象；
  2. 在Android端定义一个Java对象，用于与JS交互；
  3. 将Java对象通过WebView的addJavascriptInterface()方法注入到JS中；
  4. 在JS中编写相应的函数，接收Android端传递的数组参数；
  5. 调用JS函数并传递数组参数。

二、详细步骤及代码实现

1. 创建WebView对象

首先，在Android应用的Activity中创建一个WebView对象并设置相关属性：

WebView webView = findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true);

2. 定义Java对象

在Android端定义一个Java对象，用于与JS交互，例如定义一个名为AndroidToJS的Java对象：

public class AndroidToJS {
    @JavascriptInterface
    public void receiveArray(String[] array) {
        // 处理接收到的数组数据
    }
}

3. 注入Java对象到JS

通过WebView的addJavascriptInterface()方法将Java对象注入到JS中：

webView.addJavascriptInterface(new AndroidToJS(), "android");

4. 在JS中编写接收数组的函数

在JS中编写一个函数，用于接收Android端传递的数组参数：

function receiveArrayFromAndroid(array) {
    // 处理接收到的数组数据
}

5. 调用JS函数并传递数组参数

最后，在Android端调用JS函数并传递数组参数：

String[] androidArray = {"A", "B", "C"};
String jsCode = "javascript:receiveArrayFromAndroid(" + Arrays.toString(androidArray) + ")";
webView.loadUrl(jsCode);

三、JS处理收到的数组数据

在JS中接收到Android端传递的数组参数后，可以通过以下方式进行处理：

function receiveArrayFromAndroid(array) {
    array.forEach(function(item) {
        console.log(item);
    });
}

四、整体流程示意图

sequenceDiagram
    participant Android
    participant WebView
    participant JS

    Android ->> WebView: 创建WebView对象
    WebView->>Android: 设置JavaScriptEnabled
    Android->>WebView: 定义Java对象(AndroidToJS)
    Android->>WebView: 注入Java对象到JS
    JS->>WebView: 编写接收数组的函数(receiveArrayFromAndroid)
    Android->>JS: 调用JS函数并传递数组参数

通过以上步骤，你可以成功实现Android调用JS并传递数组的功能。希望这篇文章对你有所帮助，如果有任何疑问，欢迎随时向我提问。祝学习顺利！