Android 传值给react native

48 阅读1分钟
  1. 创建一个java类和一个react package。

  2. 在AppInfoPackage.java类中写入需要传递的值:(按alt+enter自动引入包)

package com.reactnativedemo.modules;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;

import com.facebook.react.bridge.Callback;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.reactnativedemo.BuildConfig;

import java.util.HashMap;
import java.util.Map;

public class AppInfoPackage extends ReactContextBaseJavaModule {

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

    @NonNull
    @Override
    public String getName() {
        return "AppInfoModule";
    }

    @Nullable
    @Override
    // 获取环境
    public Map<String, Object> getConstants() {
        final Map<String, Object> constants = new HashMap<>();
        constants.put("APP_ENV", BuildConfig.BUILD_TYPE);
        constants.put("APPLICATION_ID", BuildConfig.APPLICATION_ID);
        constants.put("VERSION_CODE", BuildConfig.VERSION_CODE);
        constants.put("VERSION_NAME", BuildConfig.VERSION_NAME);
        constants.put("BASE_URL", BuildConfig.BASE_URL);
        constants.put("IS_HERMES_ENABLED", BuildConfig.IS_HERMES_ENABLED);
        constants.put("IS_NEW_ARCHITECTURE_ENABLED", BuildConfig.IS_NEW_ARCHITECTURE_ENABLED);
        return constants;
    }
}

  1. 在RNReactPackage.java中添加这个类:(按alt+enter自动引入包)
package com.reactnativedemo.modules;

import androidx.annotation.NonNull;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
public class RNReactPackage implements ReactPackage {
    @Override
    public List<ViewManager> createViewManagers(@NonNull ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }
    @Override
    public List<NativeModule> createNativeModules(
            @NonNull ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        // 添加一个安卓原生的activity模块
        modules.add(new AppInfoPackage(reactContext));
        return modules;
    }
}

  1. 在mainapplication中将RNReactPackage添加进去:(按alt+enter自动引入包)

  val packages: MutableList<ReactPackage> = PackageList(this).packages.toMutableList()
                packages.add(RNReactPackage())
                return packages

  1. 在js中,src目录下创建modules文件夹,并在modules文件夹下创建AppInfoModule.ts文件调用原生参数
import { NativeModules, Platform } from 'react-native';
const { AppInfoModule } = NativeModules;
console.log(NativeModules.AppInfoModule)
// 明确告知 TypeScript 对象的结构
interface EnvironmentDictionary {
    [key: string]: string;
}
const { APP_ENV: app_env } = AppInfoModule;
//可按需引入安卓代码AppInfoPackage.java中定义的变量
// @Nullable
// @Override
// // 获取环境
// public Map<String, Object> getConstants() {
//     final Map<String, Object> constants = new HashMap<>();
//     constants.put("APP_ENV", BuildConfig.BUILD_TYPE);
//     constants.put("APPLICATION_ID", BuildConfig.APPLICATION_ID);
//     constants.put("VERSION_CODE", BuildConfig.VERSION_CODE);
//     constants.put("VERSION_NAME", BuildConfig.VERSION_NAME);
//     constants.put("BASE_URL", BuildConfig.BASE_URL);
//     constants.put("IS_HERMES_ENABLED", BuildConfig.IS_HERMES_ENABLED);
//     constants.put("IS_NEW_ARCHITECTURE_ENABLED", BuildConfig.IS_NEW_ARCHITECTURE_ENABLED);
//     return constants;
// }
const envDic: EnvironmentDictionary = Platform.select<EnvironmentDictionary>({
    ios: {
        "1": 'debug',
        "2": 'test',
        "3": 'stage',
        "4": 'production'
    },
    android: {
        debug: 'debug',
        releaseTest: 'test',
        releaseStage: 'stage',
        release: 'production',
    }
}) as EnvironmentDictionary;

const appEnv = envDic[app_env] || 'production';
console.log('当前环境', appEnv);

export default {
    appEnv,
    isDebug: appEnv === 'debug',
    isTest: appEnv === 'test',
    isStage: appEnv === 'stage',
    isProd: appEnv === 'production',
};


  1. 业务层调用appEnv:

👀关注公众号:Android老皮!!!欢迎大家来找我探讨交流👀