react native 原生页面跳转到React页面，react页面回退到原生页面实现。

1.最新实现方式，只要继承ReactActivity，重写getMainComponentName()方法。内部已实现。

2.以前实现方式，实现DefaultHardwareBackBtnHandler接口，在ReactInstanceManager 设置DefaultHardwareBackBtnHandler为当前activity即可。

具体代码：

public class TestRNActivity extends AppCompatActivity implements DefaultHardwareBackBtnHandler, PermissionAwareActivity {
private ReactRootView mReactRootView;
private ReactInstanceManager mReactInstanceManager;
private @Nullable
PermissionListener mPermissionListener;
private @Nullable
com.facebook.react.bridge.Callback mPermissionsCallback;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
String filePath = getIntent().getStringExtra("filePath");
initReactRootView(true,filePath);
}
private void initReactRootView(boolean isRelease, String filePath) {
// 发布版加载本地文件，测试架子啊assent目录下文件
File file = new File(filePath);
if (isRelease) {
mReactInstanceManager = ReactInstanceManager.builder()
.setCurrentActivity(this)
.setApplication(getApplication())
.setJSMainModulePath("index.android")
.addPackages(Arrays.<ReactPackage>asList(
new MainReactPackage()
))
//设置监听为当前activity
.setDefaultHardwareBackBtnHandler(this)
.setInitialLifecycleState(LifecycleState.RESUMED)
.setJSBundleFile(filePath)
.build();
} else {//测试模式，加载assent目录下的
mReactInstanceManager = ReactInstanceManager.builder()
.setCurrentActivity(this)
.setApplication(getApplication())
.setJSMainModulePath("index.android")
.addPackages(Arrays.<ReactPackage>asList(
new MainReactPackage()
))
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.setBundleAssetName("index.android.bundle")
.build();
}
mReactRootView = new ReactRootView(this);
//传参
//
var
initProps = this.props.bundle; 获取参数
Bundle bundle = new Bundle();
bundle.putString("bundle", "首次进入参数");
mReactRootView.startReactApplication(mReactInstanceManager, getIntent().getStringExtra("INDEX"), bundle);
setContentView(mReactRootView);
// 运行中重新加载bundle文件
//
mReactInstanceManager.recreateReactContextInBackground();
}
//
//此方法监听js端，在顶部页面时调用原生返回方法
@Override
public void invokeDefaultOnBackPressed() {
super.onBackPressed();
}
@Override
protected void onPause() {
super.onPause();
if (mReactInstanceManager != null) {
mReactInstanceManager.onHostPause(this);
}
}
@Override
protected void onResume() {
super.onResume();
if (mReactInstanceManager != null) {
mReactInstanceManager.onHostResume(this);
}
if (mPermissionsCallback != null) {
mPermissionsCallback.invoke();
mPermissionsCallback = null;
}
}
@Override
protected void onDestroy() {
super.onDestroy();
if (mReactRootView != null) {
mReactRootView.unmountReactApplication();
mReactRootView = null;
}
if (mReactInstanceManager != null) {
mReactInstanceManager.onHostDestroy(this);
}
}
//物理返回事件传递
@Override
public void onBackPressed() {
if (mReactInstanceManager != null) {
mReactInstanceManager.onBackPressed();
}else{
super.onBackPressed();
}
}
// 开发者模式
@Override
public boolean onKeyUp(int keyCode, KeyEvent event) {
if (mReactInstanceManager != null &&
mReactInstanceManager.getDevSupportManager().getDevSupportEnabled()) {
if (keyCode == KeyEvent.KEYCODE_MENU) {
mReactInstanceManager.showDevOptionsDialog();
return true;
}
}
return super.onKeyUp(keyCode, event);
}
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
if (mReactInstanceManager != null) {
mReactInstanceManager.onActivityResult(this, requestCode, resultCode, data);
}
}
@Override
protected void onNewIntent(Intent intent) {
if (mReactInstanceManager != null) {
mReactInstanceManager.onNewIntent(intent);
}
super.onNewIntent(intent);
}
@Override
public boolean onKeyLongPress(int keyCode, KeyEvent event) {
if (mReactInstanceManager != null
&& mReactInstanceManager.getDevSupportManager().getDevSupportEnabled()
&& keyCode == KeyEvent.KEYCODE_MEDIA_FAST_FORWARD) {
mReactInstanceManager.showDevOptionsDialog();
return true;
}
return false;
}
/**
* 权限动态申请
*
* @param permissions
* @param requestCode
* @param listener
*/
@RequiresApi(api = Build.VERSION_CODES.M)
@Override
public void requestPermissions(String[] permissions, int requestCode, PermissionListener listener) {
mPermissionListener = listener;
requestPermissions(permissions, requestCode);
}
@Override
public void onRequestPermissionsResult(
final int requestCode,
final String[] permissions,
final int[] grantResults) {
mPermissionsCallback = new com.facebook.react.bridge.Callback() {
@Override
public void invoke(Object... args) {
if (mPermissionListener != null && mPermissionListener.onRequestPermissionsResult(requestCode, permissions, grantResults)) {
mPermissionListener = null;
}
}
};
}
}

最后

以上就是沉静台灯为你收集整理的react native 原生页面跳转到React页面，react页面回退到原生页面实现。的全部内容，希望文章能够帮你解决react native 原生页面跳转到React页面，react页面回退到原生页面实现。所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。