js實作介面向原生介面發送訊息並跳轉功能

本文實例為大家分享了js介面向原生介面發送訊息並跳轉的具體程式碼，供大家參考，具體內容如下

步驟一 
在idea中，打開rn專案下的./Android/app,這個過程需要一點兒時間，可能還需要下載gradle的依賴什麼的。

步驟二 
跟做原生app沒差，我們新建一個TestActivity，簡單起見，僅實現如下：

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

   

步驟三 
寫一個類別在該類別中。 
具體代碼：

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

   

步驟四

實作一個套件管理器，並將接收訊息的類別ExampleInterface，註冊進去。 
程式碼如下：

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

   

步驟五 
在MainApplication中新增套件管理類別AnExampleReactPackage； reee