React-native中的ReadableMap接口如何将JS转换为JAVA？

Question

我试图了解如何正确地将选项从react-native的js端传递到java端.

react-native桥使用ReadableMap进行转换,但作为Java noob,我无法理解其工作原理.

更具体地说,我不明白:

• 实际转换如何运作？
• 如何判断下游Java代码需要什么类型/格式？
• 如何正确使用ReadableMap来做到这一点？

一般来说,我想知道这是如何工作的,但我会给出一个具体的例子,我正在考虑给出一些背景信息.

---

react-native软件包公开了一个日期时间选择器.

JS方面有一个showTimePicker方法:

showTimePicker(date, callback) {
    date = date || new Date();
    console.log(this.props);
    debugger
    var options = {
        ...this.props,
        hour:date.getHours(),
        minute:date.getMinutes()
    };
    RCTDateTimePicker.showTimePicker(options, function (hour, minute) {
        date.setHours(hour);
        date.setMinutes(minute);
        callback(date);
    });
}

RCTDateTimePicker.showTimePicker在本机端桥接到Java 方法:

@ReactMethod
public void showTimePicker(ReadableMap options, Callback callback) {
    DialogFragment timePicker = new TimePicker(options, callback);
    timePicker.show(activity.getFragmentManager(), "timePicker");
}

哪个叫

public TimePicker(ReadableMap options, Callback callback) {
    final Calendar c = Calendar.getInstance();
    this.callback = callback;
    hour = options.hasKey("hour") ? options.getInt("hour") : c.get(Calendar.HOUR_OF_DAY);
    minute = options.hasKey("minute") ? options.getInt("minute") : c.get(Calendar.MINUTE);
}

它创建了Android TimePicker的实例.我的目标是将Timepicker的样式从watch更改为spinner.

有一个可设置的XML属性android:timePickerMode="spinner"但我不认为我可以通过react-native传递XML属性吗？

我还在评论中发现了一个传递defStyleAttr来执行此操作的建议,但我不明白如何做.

Answer 1

首先,请参阅Android Native Modules的React Native文档中的Argument Types列表.

参数类型

使用@ReactMethod注释的方法支持以下参数类型,它们直接映射到它们的JavaScript等价物

• 布尔 - >布尔
• 整数 - >数字
• 双 - >数字
• 浮动 - >数量
• String - > String
• 回调 - >功能
• ReadableMap - > Object
• ReadableArray - > Array

因此,您可以通过timePickerMode更新optionsJS端传递以包含它来传递额外字段作为String .

var options = {
    ...this.props,
    hour:date.getHours(),
    minute:date.getMinutes(),
    timePickerMode:"spinner"
};

然后从自定义TimePicker构造函数中的ReadableMap获取该值.

String timePickerMode = options.hasKey("timePickerMode") ?
        options.getString("timePickerMode") : defaultTimePickerMode;

现在您拥有了您想要设置的值.不幸的是,似乎没有timePickerMode可以通过编程方式设置.这个SO问题询问如何做到这一点和@alanv(其简介表明他们是Google的软件工程师)表明它在运行时是不可能的.