Node.js는 기본 인터페이스에 메시지를 보내고 함수로 점프하는 인터페이스를 구현합니다.

이 글의 예시는 참고용으로 메시지를 보내고 js 인터페이스에서 네이티브 인터페이스로 점프하는 구체적인 코드를 공유합니다.

1단계
아이디어에서 엽니다. rn 프로젝트 ./Android/app에서 이 프로세스는 시간이 걸리며 Gradle 종속 항목 등을 다운로드해야 할 수도 있습니다.

2단계
기본 앱을 만드는 것과 동일합니다. 간단하게 하기 위해 다음과 같이만 구현합니다.

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();
      }
    });
 
  }
}

3단계
ExampleInterface가 ReactContextBaseJavaModule을 확장하고 이 클래스에서 메시지를 받는 클래스를 작성합니다.
특정 코드:

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);
  }
 
}

4단계

패키지 관리자를 구현하고 메시지를 수신하는 예제 인터페이스 클래스를 등록합니다. .
코드는 다음과 같습니다.

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();
  }
}

5단계
MainApplication에 패키지 관리 클래스 AnExampleReactPackage를 추가합니다.

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

6단계

js 인터페이스에서

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