美文网首页
react-native调用原生模块接口,并且回调到rn执行

react-native调用原生模块接口,并且回调到rn执行

作者: 康闹闹2013 | 来源:发表于2019-06-12 15:45 被阅读0次

    原生端代码:

    第一步:新建一个类,实现RCTBridgeModule

    xxx.h文件

    @interfaceMyImagePickerManager :  NSObject<RCTBridgeModule>

    @end

    xxx.m文件:

    RCT_EXPORT_MODULE(MyImagePickerModule)

    RCT_EXPORT_METHOD(openPhoto:(RCTResponseSenderBlock)callback)

    {

    NSDictionary * dic = @{@"uniqueId":uniqueId,@"networkType":network,@"versionCode":versionC,@"versionName":shortVersion};}

    callback(@[dic]);

    其中(RCTResponseSenderBlock)callback 是react-native传过来的回调函数,这个函数接受一个数组参数;那么原生在调用该callback的时候,传入了参数 @[dic]

    js端代码:

    import {NativeModules, Platform }from 'react-native';

    NativeModules.MyImagePickerModule.openPhoto((resp) => {

    let body = {

    uniqueId:resp.uniqueId,

            networkType:resp.networkType,

            versionName:resp.versionName,

            versionCode:resp.versionCode,

        };

    //做你想要做的事情

    });

    其中resp则是原生那边传过来的参数dic,dic是一个json格式,通过dic.networkType可以取到参数字典中的每个值。

    相关文章

      网友评论

          本文标题:react-native调用原生模块接口,并且回调到rn执行

          本文链接:https://www.haomeiwen.com/subject/hwelfctx.html