js implementiert die Schnittstelle, um Nachrichten an die native Schnittstelle zu senden und zur Funktion zu springen

Das Beispiel in diesem Artikel teilt den spezifischen Code zum Senden von Nachrichten und zum Springen von der js-Schnittstelle zur nativen Schnittstelle als Referenz. Der spezifische Inhalt ist wie folgt

Schritt 1
In der Idee öffnen Wenn Sie das rn-Projekt ./Android/app verwenden, dauert dieser Vorgang eine Weile und Sie müssen möglicherweise auch Gradle-Abhängigkeiten oder ähnliches herunterladen.

Schritt 2
Es ist das Gleiche wie beim Erstellen einer nativen App. Der Einfachheit halber implementieren wir sie nur wie folgt:

public class TestActivity extends AppCompatActivity {
 
  private Button mBtGoBack;
 
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_test);
    mBtGoBack = (Button) findViewById(R.id.bt_go_back);
    mBtGoBack.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        finish();
      }
    });
 
  }
}

Schritt 3
Schreiben Sie eine Klasse „ExampleInterface“, die ReactContextBaseJavaModule erweitert und Nachrichten in dieser Klasse empfängt.
Spezifischer Code:

public class ExampleInterface extends ReactContextBaseJavaModule {
 
  private ReactApplicationContext mRApplicationContext;
 
  public ExampleInterface(ReactApplicationContext reactContext) {
    super(reactContext);
    mRApplicationContext = reactContext;
  }
 
  //RN使用这个名称来调用原生模块的其他函数
  @Override
  public String getName() {
    return "ExampleInterface";
  }
  //必须写@ReactMethod，将其注册为能够被React调用的函数
  @ReactMethod
  public void HandlerMessage(String aMessage){
    Log.d("lt","====receive message from RN==="+aMessage);
     //这部分实现简单的跳转
    Intent intent = new Intent(mRApplicationContext,TestActivity.class);
    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
    mRApplicationContext.startActivity(intent);
  }
 
}

Schritt 4

Implementieren Sie einen Paketmanager und registrieren Sie die Klasse „ExampleInterface“, die die Nachricht empfängt .
Der Code lautet wie folgt:

public class AnExampleReactPackage implements ReactPackage {
 
  @Override
  public List<NativeModule> createNativeModules(ReactApplicationContext reactApplicationContext) {
    List<NativeModule> modules = new ArrayList<>();
    modules.add(new ExampleInterface(reactApplicationContext));
    return modules;
  }
 
  @Override
  public List<Class<? extends JavaScriptModule>> createJSModules() {
    return Collections.emptyList();
  }
 
  @Override
  public List<ViewManager> createViewManagers(ReactApplicationContext reactApplicationContext) {
    return Collections.emptyList();
  }
}

Schritt 5
Fügen Sie die Paketverwaltungsklasse AnExampleReactPackage in MainApplication hinzu;

@Override
 protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
    new MainReactPackage(),
    new AnExampleReactPackage()
  );
 }

Schritt 6

Senden Sie in der js-Schnittstelle eine Nachricht

buttonPress:function(){
  NativeModules.ExampleInterface.HandlerMessage('test');
  }