前言
上一篇文章介绍了使用发送事件的方式来进行React native与Android之间的通信，如果想了解的话，请看看这篇文章的介绍React native 与Android原生交互方式(一),本文将介绍第二种通信方式，即回调的方式，它是通过callback来实现通信的。
Callback方式
原生模块有一种特殊的参数那就是回调函数，在绝大多数情况下该用来提供一个回调方法进行传值给JavaScript。具体该怎么样提供回调方法呢？还记得前面的文章中讲到原生模块封装给React native前端调用不？被调用的方法使用@ReactMethod注解。对了，这边也差不多。我们来看一下代码是怎么样实现的。本文的代码是基于上一篇文章中的项目代码示例。
1、原生模块中首先在MyModule类中添加被Rn调用的方法，代码如下：
@ReactMethod
public void callNativeByCallBack(String msg, Callback successCallback){
Log.e("wfunny","called by callback");
String result = "callback 处理结果：" +msg;
successCallback.invoke(result);
}
2、React native端在index.android.js中添加调用原生的方法代码，本例子是通过点击文本触发的，代码如下：
render(){
return (
<View style = {myStyles.container}>
<Text style = {myStyles.welcome} onPress={this.callNative.bind(this)}>
当你点我的时候会调用原生方法，原生方法延迟3s后会向前端发送事件。
前端一直在监听该事件，如果收到，则给出alert提示! send 方式
</Text>
<Text style = {myStyles.welcome} onPress={this.callNativeByCallBack.bind(this,'callback send ok',null)}>
callback方式 交互方式！！！！
</Text>
<Text style = {myStyles.instructions}>
{this.state.content}
</Text>
</View>
);
}
callNativeByCallBack(msg){
console.log("js called by callback");
NativeModules.MyModule.callNativeByCallBack(msg
,(result) => {
this.setState({content:result});
})
}
从以上代码可以看出，callNativeByCallBack 调用原生的模块，CallBack对应的就是JS中的function,JS调用Native模块处理完毕以后将结果回调给JS端。向Native发送了一个"callback send ok"的消息,在第二个参数接收回调结果。 Callback的方式通俗简单易懂。但是注意该回调方法在调用之后不会立即有返回，因为该为桥接方式的异步调用的操作，该通过消息循环完成，所以返回时机不确定！
上一篇：React native 与Android原生交互方式(一)
下一篇：React native 与Android原生交互方式(三)
