3

我正在尝试在 iOS 上的 RN 项目上创建本机 UI 组件。我将道具传递uri给我的 Native 组件。但是当我尝试在init我认为的方法中使用它时，它是nil.

// myNativeComponentManager.m

@implementation myNativeComponentManager

RCT_EXPORT_MODULE()
RCT_EXPORT_VIEW_PROPERTY(uri, NSString *);

- (UIView *)view
{
    return [[myNativeComponentView alloc] init];
}

@end

// myNativeComponentView.m

@implementation myNativeComponentView

- (instancetype)init
{
    self = [super init];

// self.uri is nil here
    NSURL *imageURL = [NSURL URLWithString:self.uri];
    NSData *imageData = [NSData dataWithContentsOfURL:imageURL];
    UIImage *image = [UIImage imageWithData:imageData];

    self.imgView = [[UIImageView alloc] initWithFrame:self.bounds];
    self.imgView.image = image;
    self.imgView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    self.imgView.userInteractionEnabled = YES;
    [self addSubview:self.imgView];

    UITapGestureRecognizer *tap =
    [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(onTap:)];
    [self.imgView addGestureRecognizer:tap];

    return self;
}

- (void)onTap:(id)sender {
// self.uri is not nil here
    NSLog(self.uri);
}
 @end

uri在方法nil中init但不在onTap方法中，所以这让我觉得我们不能在 init 方法中使用属性？在这种情况下，我如何用这个 uri 初始化我的图像？有没有办法知道视图是否已初始化？我想过创建一个方法来设置我的图像并在 JS 部分调用它，componentDidMount但感觉不对。

谢谢你的帮助！

4

1 回答 1

1

从 react native 传递的 props 无法在原生 UIView 的 init 方法中获取。您应该在属性设置器方法中处理它。

// react native x.js
export default class EmailSSO extends React.Component {
    render() {
        var credential = {
            username: "abc",
            password: "xyz",
        };
        return (
            <EmailView credential={credential} style={{ flex: 1 }} />
        );
    }
}

// native XXXView.m
- (void)setCredential:(Credential *)credential
{
  _credential = credential;
  NSLog(@"Username is %@", credential.username);
}
于 2018-04-22T17:12:35.367 回答