[复习] android 原生模块(Promise,事件监听)
2021-03-18 本文已影响0人
吴敬悦
前面两篇:
[复习] android 原生模块(带参数)
[复习] android 原生模块(不带任何参数)
我是接着前两天的。
官网的地址跟前面是相同的:
Promises
Sending Events to JavaScript
首先是 Promise
,我们知道在 js
中,promise
是非常流行的,与 promise
对应的是 async/await
;如果原生模块是 promise
,那么我们就能在 js
中使用 await
的方式来解决异步问题了。
原生中的实现:
@ReactMethod
fun testPromise(age: Double, promise: Promise) {
if (age > 27) {
promise.resolve("吴敬没钱")
} else {
promise.reject("404", "吴敬穷逼")
}
}
下面是 js
的实现,跟平时调用函数一样:
NativeModules?.TestModule?.testPromise(27)
.then(res => {
console.log(res);
})
.catch(err => {
console.log(err);
});
// 可以在 async 函数中直接
await NativeModules?.TestModule?.testPromise(27)
下面是事件监听,当我们原生出发什么事件需要告诉 js
端的时候,我们就需要使用事件监听。先看原生端:
@ReactMethod
fun sendMessage() {
val params = Arguments.createMap()
params.putString("name", "吴敬")
params.putBoolean("isHaveMoney", false)
reactApplicationContext.getJSModule(RCTDeviceEventEmitter::class.java).emit("wujing", params)
}
我这里是使用 js
出发事件,相当于点击了下载按钮,然后原生就会给 js
发送事件,这里我就出发一次。下面看 js
端中的使用:
// 监听事件
const eventEmitter = new NativeEventEmitter(NativeModules?.TestModule);
eventEmitter.addListener('wujing', res => {
console.log('没装穷', res);
});
其中 NativeEventEmitter
是 react-native
中的。这里的第一个参数是事件名称,第二个是回调,跟原生是相同的。模拟触发事件:
NativeModules?.TestModule?.sendMessage();