最新版本rn调用安卓原生方法

关于最近更新的react-native新建模板版本更新问题，之前一直是用指定版本–version 来新建模板，近几天使用默认的rn init 添加自己的代码后运行，发现总是出问题，然后查找资料发现了问题，原来是rn new的模板版本升级到0.61.5 之前的代码对应的是我指定0.44的版本 所以出错 现整理一下

1.创建一个新的 Java 类并命名为ToastModule.java

package com.your-app-name;

import android.widget.Toast;

import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

import java.util.Map;
import java.util.HashMap;

public class ToastModule extends ReactContextBaseJavaModule {
  private static ReactApplicationContext mreactContext;

  private static final String DURATION_SHORT_KEY = "SHORT";
  private static final String DURATION_LONG_KEY = "LONG";

  public ToastModule(ReactApplicationContext reactContext) {
    super(reactContext);
    mreactContext = ReactContext;
  }
}
@Override
  public String getName() {
    return "ToastExample";
  }
    @Override
  public Map<String, Object> getConstants() {
    final Map<String, Object> constants = new HashMap<>();
    constants.put(DURATION_SHORT_KEY, Toast.LENGTH_SHORT);
    constants.put(DURATION_LONG_KEY, Toast.LENGTH_LONG);
    return constants;
  }
   @ReactMethod 
  public void show(String message, int duration) {
    Toast.makeText(getReactApplicationContext(), message, duration).show();
  }

2.创建一个新的 Java 类并命名为CustomToastPackage.java

package com.your-app-name;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;

import java.util.ArrayList;
import java.util.Collections;
import java.util.List;

public class CustomToastPackage implements ReactPackage {

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

  @Override
  public List<NativeModule> createNativeModules(
                              ReactApplicationContext reactContext) {
    List<NativeModule> modules = new ArrayList<>();

    modules.add(new ToastModule(reactContext));

    return modules;
  }

}

3.在MainApplication.java类中导入CustomToastPackage,在列表里添加新建的CustomToastPackage代码如下

import com.your-app-name.CustomToastPackage; // <-- 引入你自己的包
...
protected List<ReactPackage> getPackages() {
  @SuppressWarnings("UnnecessaryLocalVariable")
  List<ReactPackage> packages = new PackageList(this).getPackages();
  // Packages that cannot be autolinked yet can be added manually here, for example:
  // packages.add(new MyReactNativePackage());
  packages.add(new CustomToastPackage()); // <-- 添加这一行，类名替换成你的Package类的名字 name.
  return packages;
}

4.在项目根目录下新建一个ToastExample.js文件添加代码

import { NativeModules } from "react-native";
export default NativeModules.ToastExample;

5.在app.js中导入刚刚新建的ToastExample.js文件并调用

import ToastExample from "./ToastExample";
...

ToastExample.show("Awesome", ToastExample.SHORT);
...
这里的Awesome是赋给Toast调用的字符串

代码编写后直接cd到项目中 启动打包app到真机或模拟器上 直接能看到在屏幕上弹出toast模块