接着上一篇 React-Native系列 2、RN与native交互与数据传递 ,我们接下来研究另外的两种RN与Native交互的机制
一、Callback机制
首先Calllback是异步的,RN端调用Native端,Native会callback,但是时机是不确定的,如果多次调用的话,会存在问题。
Naive端是无法主动通过回调函数向RN端发送消息的。
具体实现代码如下:
Native端暴露好接口
@ReactMethod
public void measureLayout(Callback errorCallback,
Callback successCallback){
try {
successCallback.invoke(100, 100, 200, 200);//调用回调函数,返回结果
} catch (IllegalViewOperationException e) {
errorCallback.invoke(e.getMessage());
}
}
在RN端:
<Text style={{ fontSize: 25 }} onPress={this.CallAndroid_callback} >调用原生方法_使用_回调函数</Text>
CallAndroid_callback = () => {
NativeModules.MyNativeModule.measureLayout(
(msg) => {
console.log(msg);
},
(x, y, width, height) => {
console.log(x + '坐标,' + y + '坐标,' + width + '宽,' + height + '高');
}
);
}
二、promise机制
关于ES6中Promise的用法可以参考:http://www.cnblogs.com/lvdabao/p/5320705.html
Promise 的状态
一个 Promise 的当前状态必须为以下三种状态中的一种:
等待态(Pending)、
完成态(Fulfilled)和拒绝
态(Rejected)。
等待态(Pending)
处于等待态时,promise 需满足以下条件:
- 可以迁移至完成态或拒绝态
完成态(Fulfilled)
处于完成态时,promise 需满足以下条件:
- 不能迁移至其他任何状态
- 必须拥有一个不可变的终值
拒绝态(Rejected)
处于拒绝态时,promise 需满足以下条件:
- 不能迁移至其他任何状态
- 必须拥有一个不可变的据因
在Native侧,暴露接口:
@ReactMethod
public void rnCallNative_promise(String msg, Promise promise) {
try {
//业务逻辑处理
Toast.makeText(mContext, msg, Toast.LENGTH_SHORT).show();
String componentName = getCurrentActivity().getComponentName().toString();
promise.resolve(componentName);
}catch (Exception e){
promise.reject("100",e.getMessage());//promise 失败
}
}
在RN侧:
<Text style={{ fontSize: 25 }} onPress={this.CallAndroid_promise} >调用原生方法_使用_Promise</Text>
CallAndroid_promise = () => {
NativeModules.MyNativeModule.rnCallNative_promise('rn调用原生模块的方法-成功啦').then(
(msg) => {
console.log('promise成功:'+msg);
}
).catch(
(err) => {
console.log(err);
}
);
}
}