如何将 REACT NATIVE js 文件切换到 Android Activity [关闭]

Question

我需要在 JS 文件中的按钮单击事件上从 REACT NATIVE Activity 切换到 native android activity。我已经搜索了很多。请帮帮我。

Answer 1

为你的原生安卓活动创建一个意图过滤器

<activity>
    <intent-filter>
        <data android:scheme="my.special.scheme" />
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT"></category>
    </intent-filter>
</activity>

使用Linking openURL api。

Linking.openURL('my.special.scheme://other/parameters/here')

Link to sample application working

Answer 2

您可以创建一个模块并向 JS 公开一个 ReactMethod，这将为您打开活动。

public class RctActivityModule extends ReactContextBaseJavaModule {
    public static final String REACT_CLASS = "RctActivity";

    public RctActivityModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }

    @Override
    public String getName() {
        return REACT_CLASS;
    }

    @ReactMethod @SuppressWarnings("unused")
    public void startActivity(String extraParam) {
        Activity context = ContextProvider.getActivityContext();
        if (context != null && !context.isFinishing()) {
            Intent rctActivityIntent = new Intent(context, RctActivity.class);
            rctActivityIntent.putExtra(RctActivity.EXTRA_PARAM, extraParam);
            context.startActivity(rctActivityIntent);
        }
    }
}

别忘了将你的新模块添加到你的包中

public class RCCPackage implements ReactPackage {

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        return Arrays.<NativeModule>asList(
                new RctActivityModule(reactContext)
        );
    }

    @Override
    public List<Class<? extends JavaScriptModule>> createJSModules() {
        return Collections.emptyList();
    }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
    ...
    }
}

创建一个代表您的模块的 JS 文件 (RctActivity.js)。现在把它放在你的 react-native 项目的根目录下。

RctActivity.js：

import { NativeModules } from 'react-native';
module.exports = NativeModules.RctActivity;

在您的 JavaScript 代码 (index.js) 中，导入 RctActivity 模块：

import RctActivity from './RctActivity'

并使用您公开的方法，如下所示： RctActivity.startActivity('MyExtraParam');

编辑： 为了打开一个新活动，我必须保留对当前正在运行的活动的引用。所以我使用了这个小助手类：

public class ContextProvider {
    private static WeakReference<Activity> sActivityWR;

    public static void setActivityContext(Activity activity) {
        if (sActivityWR == null) {
            sActivityWR = new WeakReference<>(activity);
        }
    }

    public static Activity getActivityContext() {
        return sActivityWR != null ? sActivityWR.get() : null;
    }

    public static void clearActivityContext() {
        if (sActivityWR != null) {
            sActivityWR.clear();
        }
        sActivityWR = null;
    }
}

要使用它，请将其连接到您的基本活动 onResume 和 onPause 方法：

public class RctActivity extends com.facebook.react.ReactActivity {
    @Override
    protected void onResume() {
        Log.v(getTag(), "onResume");
        ContextProvider.setActivityContext(this);
        super.onResume();
    }

    @Override
    protected void onPause() {
        Log.v(getTag(), "onPause");
        ContextProvider.clearActivityContext();
        super.onPause();
    }
}

别忘了现在你的MainActivity 需要扩展RctActivity