android - 在React Native中调用导出的方法

Question

我想在 Objective C 中创建一个 View 并在 React Native 中使用，但不知道该怎么做这是我的代码:对象-C:

#import "DGTAuthenticateButtonView.h"
#import "RCTBridge.h"
#import "RCTEventDispatcher.h"
#import "UIView+React.h"
#import <DigitsKit/DigitsKit.h>

@implementation DGTAuthenticateButtonView

RCT_EXPORT_MODULE()
- (UIView *) view {
  UIButton *button = [[UIButton alloc] init];
  [button setTitle:@"REGISTER" forState:UIControlStateNormal];
  return button;

}

RCT_EXPORT_METHOD(authenticate) {
  Digits *digits = [Digits sharedInstance];
  DGTAuthenticationConfiguration *configuration = [[DGTAuthenticationConfiguration alloc] initWithAccountFields:DGTAccountFieldsDefaultOptionMask];
  configuration.phoneNumber = @"+345555555555";
  [digits authenticateWithViewController:nil configuration:configuration completion:^(DGTSession *newSession, NSError *error){
  }];

}

@end

我想在 TouchableOpacity 中调用authenticate，但它不起作用:(

import React, {Component} from 'react';
import {
    AppRegistry,TouchableOpacity
} from 'react-native';



var requireNativeComponent = require('requireNativeComponent');

var DGTAuthenticateButtonView = requireNativeComponent('DGTAuthenticateButtonView', DGTAuthenticateButtonView);

class TestProj extends Component {
    render() {
        return (

            <TouchableOpacity style={{flex: 1, backgroundColor: 'green'}}
                onPress={() => DGTAuthenticateButtonView.authenticate()}
            />

        )
    }
}

AppRegistry.registerComponent('TestProj', () => TestProj);

有人知道该怎么做吗？提前致谢。

Answer 1

看来您在这里混合了 2 个不同的概念。

您可以创建 Native UI Component - 一个本地 View ，您可以将其用作 RN render 函数中的一个组件；或者你可以创建一个 Native Module - 一个允许您添加 native 功能并从您的 JS 代码调用它的模块，该模块没有 View 。

据我所知(您没有包含 RCTViewManager 子类的代码)，您正试图在 native 上创建一个 Native UI Components side(它返回一个 View )，但不在你的 JS 中使用它(不用作你的 render 中的组件)。您还应该知道，您不能像在这里尝试做的那样简单地直接在您的 native View 上调用方法。

我建议您使用以下解决方案之一:

1. 如果您确实需要自定义的 native UI - 请按照创建 native UI 组件 的说明进行操作，然后在你的渲染功能。然后，您可以使用 Prop 传达按钮按下映射到回调(参见 here 关于从 native 到 JS 的事件)。
2. 如果您不需要自定义 UI(您希望继续使用 TouchableOpacity，如示例中所示)，您可以按照说明创建一个 Native Module。然后，您将能够静态地调用您的 authenticate 方法，就像您在此处尝试执行的那样，以仅执行 native 逻辑。您甚至可以修改 authenticate 方法以接收其他参数 - 拒绝/解决 promise 或回调以在完成时通知 JS。