android – 有没有在react-native中实现JavaScriptModule的指南?

android – 有没有在react-native中实现JavaScriptModule的指南?,第1张

概述有兴趣在react-native中实现直接本机到 javascript调用.但没有找到任何指南. 请帮助一些在本机中创建和注册本机到javascript模块的示例. 已经发现官方native modules android文档中的代码有一个名为createJSModules的方法,它返回一个JavaScriptModule类列表. class AnExampleReactPackage imple 有兴趣在react-native中实现直接本机到 javascript调用.但没有找到任何指南.

请帮助一些在本机中创建和注册本机到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. * ... */@DoNotStrippublic interface JavaScriptModule {}

我能够创建接口并将其传递给createJsModules类,但不知道如何从Js代码注册适当的JavaScript模块.

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

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

ActionsModule JsModule = context.getJsModule(ActionsModule.class);
JsModule.callAction(“greet”,“hello”);

这将异步调用您注册的Js模块方法.

// AppPackage.javapublic 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.javapublic interface ActionsModule extends JavaScriptModule {    voID callAction(String type,String value);}// MyReactActivity.javapublic class MyReactActivity extends ReactActivity implements ReactInstanceManager.ReactInstanceEventListener {    ...    @OverrIDe    public voID onReactContextinitialized(ReactContext context) {        ActionsModule JsModule = context.getJsModule(ActionsModule.class);        JsModule.callAction("greet","hello");    }    ...}
// ActionsModule.Jsvar ActionsModule = {  callAction(type,value) {    console.log("callAction => " + type + ":" + value);  },}module.exports = ActionsModule;// index.androID.Jsimport {  AppRegistry} from 'react-native';import App from './components/App';// Js module registrationvar BatchedBrIDge = require('BatchedBrIDge');var ActionsModule = require('./ActionsModule');BatchedBrIDge.registerCallableModule(  'ActionsModule',ActionsModule);//~ Js module registrationAppRegistry.registerComponent('MyApp',() => App);

UPD>将一个演示项目推向了github,并提供了androID和ios的解决方案:https://github.com/dmba/rct-native2js

总结

以上是内存溢出为你收集整理的android – 有没有在react-native中实现JavaScriptModule的指南?全部内容,希望文章能够帮你解决android – 有没有在react-native中实现JavaScriptModule的指南?所遇到的程序开发问题。

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

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

原文地址: http://outofmemory.cn/web/1135274.html

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

发表评论

登录后才能评论

评论列表(0条)

保存