react-native创建原生模块

前端之家收集整理的这篇文章主要介绍了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相关文章