Question

我有一个原生的Android应用程序，现在有一个React-Native部分。

简而言之，我在原生Android / Java中有一个列表视图。当我点击一行时，我会启动一个新的Activity，它会导致React-Native代码。

组件进行API调用，但在此之前，我的代码通过React Native模块从头文件的Java / Android设置中的用户首选项中获取值，以便它可以进行正确的API调用

/actions/index.js中的React Native API调用：

export const toggleBlocked = (user_id) =>
async dispatch => {
  try {
    let headers = await getHeaders();
    const response = await fetch('http://my.domain.com/api/get_data?user_id=`${user_id}`', { headers, method: 'GET' });
    if (response.status == 200) {
      // do stuff
    } else {            
      ToastAndroid.show("Looks like the response wasnt good :(", ToastAndroid.LONG, ToastAndroid.CENTER);
    }
  } catch (error) {
    ToastAndroid.show("An Error Occurred :(", ToastAndroid.LONG, ToastAndroid.CENTER);
  }
};


function getHeaders() {
  let userId = UserService.getUserId()
  console.log("2. React-Native | getHeaders... user_id is " + userId)
  return (
    new Headers({
      Cookie: `abcxyz=${userId}`,
      user_id: userId,
      "User-Agent": "android",
      "Content-Type": "application/json",
      charset: "utf-8",
      "app-version": "9.1.23",
      Accept: "application/json"
    })
  )
}

回到本机Android / Java，我已经设置了我的模块和包。这是UserServiceModule.java：

    @ReactMethod
    public int getUserId() {
        SharedPreferences settings = mContext.getSharedPreferences(Constants.SettingsPreference, Context.MODE_PRIVATE);
        int userId = settings.getUserId();
        Log.d(TAG, "1. Java/Android code. UserID is " + userId);
        return userId;
    }

当我运行代码时，user_id始终为null。我甚至希望我的日志按顺序显示（参见编号的日志），但它们是反向的？

"1. Java/Android code. UserID is 123"
"2. React-Native | getHeaders... user_id is 123"

任何见解都会很棒。感谢。

更新/解决方案 以下是更新后的更改：

@ReactMethod
public void getUserId(final Promise promise) {
    SharedPreferences settings = mContext.getSharedPreferences(Constants.SettingsPreference, Context.MODE_PRIVATE);
    int userId = settings.getUserId();
    Log.d(TAG, "1. Java/Android code. UserID is " + userId);

    promise.resolve(Integer.toString(userId));
}

Answer 1

@ReactMethod函数总是假设返回void并且是异步的。你得到null的原因是因为你的JS代码是同步编写的。它将变量userId初始化为null，并使用异步调用的返回值进行设置。但是因为你编写的代码是同步的，所以在react方法返回值之前它将转到下一行。

您需要像执行调度方法一样执行异步等待。然而，由于反应方法返回空值，这是不够的。坦率地说，我不知道如何找不到找不到错误的方法错误。也许@ReactMethod会忽略您在Java中定义的返回值？

无论如何，在设置异步等待之后。做一些类似于他们在这里做的事情： https://facebook.github.io/react-native/docs/native-modules-android.html#callbacks

Answer 2

在@ReactMethod中设置isBlockingSynchronousMethod = true

示例：

@ReactMethod(isBlockingSynchronousMethod = true)
public String getString(){
    return "awesome string";
}

在js文件中：

var someString = await NativeModule.ModuleName.getString();

Android int值的React-Native模块迟交？

2 个答案: