ReactJS与Native Android中的Webview进行通信(‘Android’未定义为no-undef)

ReactJS与Native Android中的Webview进行通信(‘Android’未定义为no-undef),第1张

概述我在ReactJS中写了Web部分(不是ReactNative–非常重要).我还有简单的Android应用程序,它包含WebView,我在那里打开网站,在ReactJS上运行.有没有正确的方法,如何在Android原生webview(打开ReactJS网站)和ReactJS网站之间进行通信?顺便说一句.我已经完成了这个FacebookReactNat

我在ReactJs中写了Web部分(不是React Native – 非常重要).我还有简单的Android应用程序,它包含WebVIEw,我在那里打开网站,在ReactJs上运行.有没有正确的方法,如何在AndroID原生webvIEw(打开ReactJs网站)和ReactJs网站之间进行通信?

顺便说一句.我已经完成了这个Facebook React Native Communication,但这是React Native的典型案例.这意味着,在通过ReactActivity扩展Activity等原生AndroID应用程序中,这是无用的……

这是ReactJs源代码,我想调用Js调用Mobile.showToast(“Test”)(不仅在这里,在很多地方,在许多.tsx文件中),但它根本没有编译项目.编译错误是’Mobile’未定义no-undef:

import * as React from "react";import {  button,} from "components";class Login extends React.PureComponent {  public render() {    return (      <Fullscreen>        <Content>          <button onClick={this.handleRedirect} fullWIDth>        </Content>      </Fullscreen>    );  }  private handleRedirect = () => {    //Here I wanted to call Js call for AndroID JavaScriptInterface interrogation    Mobile.showToast("Test");  };}export default Login;

这是附加JavaScriptInterface Js调用的源代码(在本例中只调用showToast):

webVIEw.addJavaScriptInterface(new MobileAppInterface(getContext()), "Mobile");import androID.content.Context;import androID.webkit.JavaScriptInterface;import androID.Widget.Toast;public class MobileAppInterface {    Context mContext;    /**     * Instantiate the interface and set the context     */    public MobileAppInterface(Context c) {        mContext = c;    }    /**     * Show a toast from the web page     */    @JavaScriptInterface    public voID showToast(String toast) {        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();    }}

解决方法:

在您的React方法中,由于您将JavaScriptInterface命名为“Mobile”,因此您需要修改您的方法以使用window.Mobile.showToast(“Test”);因为接口被导出到全局窗口对象:

class Login extends React.PureComponent {    ...    private handleRedirect = () => {        if (window.Mobile)            window.Mobile.showToast("Test");    };}

例如,如果您将JavaScriptInterface命名为“AndroID”,

webVIEw.addJavaScriptInterface(new MobileAppInterface(getContext()), "AndroID");

然后你的方法体需要如下:

class Login extends React.PureComponent {    ...    private handleRedirect = () => {        if (window.AndroID)            window.AndroID.showToast("Test");    };}
总结

以上是内存溢出为你收集整理的ReactJS与Native Android中的Webview进行通信(‘Android’未定义为no-undef)全部内容,希望文章能够帮你解决ReactJS与Native Android中的Webview进行通信(‘Android’未定义为no-undef)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/web/1116751.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-29
下一篇2022-05-29

发表评论

登录后才能评论

评论列表(0条)

    保存