react-native创建原生模块

react-native文档未更新,照着文档实现还是坑了不少,记录下基本步骤。

1,继承ReactContextBaseJavaModule
a,getName:模块名称
b,getConstants:常量映射
c,@ReactMethod注解暴露java方法
public void show(String message,int duration) {
    Toast.makeText(getReactApplicationContext(),message,duration).show();
}
2,注册原生模块
a,提供一个ReactPackage(继承ReactPackage)
b,public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) 
添加原生模块。
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>(1);
        modules.add(new MyToast(reactContext));
        return modules;
    }
c,注册包(ReactPackage)
1),ReactInstanceManager.addPackage原生实现的ReactPackage;
2),ReactApplication重写getPackages.
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),new MyReactPackage()
      );
    }
3,js使用
a,js引入原生模块
var { NativeModules } = require('react-native');
var MyToast = NativeModules.MyToast;
b,调用
MyToast.show('you click me!',MyToast.SHORT);

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...