如何从我的 Android 代码在 web 视图中运行 React JS 函数？

Posted 2023-02-22

【中文标题】如何从我的 Android 代码在 web 视图中运行 React JS 函数？

【英文标题】：How can I run React JS functions in a webview from my Android code?

【发布时间】：2019-06-15 08:53:18

【问题描述】：

所以我有一个 React-Typescript webapp，我在我的 android 应用程序的 WebView 中托管。

我只是想将数据从 Android 客户端传递到 Webview。 然而，它是一个使用 webpack 构建的 React 应用程序这一事实似乎使事情变得复杂。

按照从该堆栈响应中找到的指令：Passing data from java class to Web View html

我尝试在 Index.tsx 中添加一个函数，并像这样从 andoird 调用它：

webview.getSettings().setjavascriptEnabled(true);
webview.loadUrl("file:///android_asset/test.html");
webview.setWebViewClient(new WebViewClient()
    public void onPageFinished(WebView view, String url)   
        webview.loadUrl("javascript:init('" + theArgumentYouWantToPass + "')");
               
);

但是它找不到该功能。我的下一个想法是将它添加到 Index.Html，但是我需要以某种方式存储数据，以便我可以从我的 React 代码中引用它。

我尝试像这样使用本地存储：

    <script type="text/javascript">
        function init(val)
        
            window.localStorage.setItem("key", val);
        
    </script>

我尝试了这个并没有窗口前缀，但两次都给我一个错误，说我试图在空引用上调用 setItem。

有人知道我如何将数据从 Android 发送到我的 React 应用程序吗？

【问题讨论】：

以下答案对我来说似乎不是解决方案。你解决了这个问题吗？ @Brian C

【参考方案1】：

您需要在设置中启用localStorage（类似于setJavaScriptEnabled）例如

webview.getSettings().setDomStorageEnabled(true);