分类导航

Android 发布时间：2022-04-28 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了android – 有没有在react-native中实现JavaScriptModule的指南？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

有兴趣在react-native中实现直接本机到 javascript 调用.但没有找到任何指南.

请帮助一些在本机中创建和@L_674_2@本机到javascript模块的示例.

已经发现官方native modules android文档中的代码有一个名为createJSModules的方法,它返回一个JavaScriptModule类列表.

class AnExampleReactPackage implements ReactPackage {

  @Override
  public List<Class<? extends JavaScriptModule>> createJSModules() {
    return Collections.emptyList();
  }

  ...

}

com.facebook.react.bridge.JavaScriptModule的Javadoc说：

/**
 * Interface denoting that a class is thE interface to a module with the same name in Js. Calling
 * functions on this interface will result in corresponding methods in JS being called.
 * ...
 */
@DoNotStrip
public interface JavaScriptModule {
}

我能够创建接口并将其传递给createJSModules类,但不知道如何从js代码@L_674_2@适当的javascript模块.

解决方法

最后,在查看了反应源后,我想出了解决方案,你需要：

>扩展JavaScriptModule并将其传递给自定义反应包的createJSModules方法(例如ActionsModule.java).
>在您内部@L_674_2@包反应活动getPackages方法或直接认为ReacTinstanceManager
>在js代码中创建具有相同名称的js文件
>按照下面列出的说明将其@L_674_2@到BatchedBridge.
>在响应上下文初始化之后,您可以通过以下方式获取并调用：

ActionsModule jsModule = context.getJSModule(ActionsModule.class);
jsModule.callAction(“greet”,“Hello”);

这将异步调用您@L_674_2@的js模块方法.

// AppPackage.java
public class AppPackage implements ReactPackage {

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }

    @Override
    public List<Class<? extends JavaScriptModule>> createJSModules() {
        return Arrays.<Class<? extends JavaScriptModule>>asList(
                ActionsModule.class
        );
    }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }

}

// ActionsModule.java
public interface ActionsModule extends JavaScriptModule {

    void callAction(String type,String value);

}

// MyReactActivity.java
public class MyReactActivity extends ReactActivity implements ReacTinstanceManager.ReacTinstanceEventListener {

    ...

    @Override
    public void onReactContexTinitialized(ReactContext context) {
        ActionsModule jsModule = context.getJSModule(ActionsModule.class);

        jsModule.callAction("greet","Hello");
    }

    ...

}

// ActionsModule.js
var ActionsModule = {

  callAction(type,value) {
    console.log("callAction => " + type + ":" + value);
  },}

module.exports = ActionsModule;

// index.android.js
import {
  AppRegistry
} from 'react-native';

import App from './components/App';

// js module registration
var BatchedBridge = require('BatchedBridge');
var ActionsModule = require('./ActionsModule');

BatchedBridge.registerCallableModule(
  'ActionsModule',ActionsModule
);
//~ js module registration

AppRegistry.registerComponent('MyApp',() => App);