「新的React Native組件

Question

」警告： 的本機組件不存在「我試圖創建一個包裝本機iOS組件的簡單React Native模塊（ Stripe SDK）。我遵循 instructions並基於我的代碼工作正常的現有組件， react-native-facebook-login。

每當我嘗試，包括我的成分在本地做出反應，我得到這個神祕的警告：

Warning: Native component for "RCTStripe" does not exist

組件確實存在。我爲它創建了一個iOS庫，其中RCTStripeManager.m/h繼承自RCTViewManager。 RCTStripe從RCTView繼承，並由管理員初始化並返回，等等。所有這些都是建立在另一個完美工作的模塊上的。

發生了什麼事？

下面是一些示例代碼：

RCTStripeManager.h

#import "RCTViewManager.h" 

@interface RCTStripeManager : RCTViewManager 

@end 

RCTStripeManager.m

#import "RCTBridge.h" 
#import "RCTEventDispatcher.h" 
#import "RCTLog.h" 

#import "RCTStripe.h" 
#import "RCTStripeManager.h" 

@implementation RCTStripeManager 
{ 
    RCTStripe *_stripe; 
} 

@synthesize bridge = _bridge; 

- (UIView *)view 
{ 
    _stripe = [[RCTStripe alloc] init]; 
    return _stripe; 
} 

- (dispatch_queue_t)methodQueue 
{ 
    return dispatch_get_main_queue(); 
} 

RCT_EXPORT_MODULE(); 

@end 

RCTStripe.h

#import "RCTView.h" 

@interface RCTStripe : RCTView 

@end 

RCTStripe.m

#import <Stripe/Stripe.h> 

#import "RCTStripe.h" 
#import "RCTLog.h" 

@implementation RCTStripe 

- (id)init 
{ 
    if ((self = [super init])) { 
     // init code here 
     UILabel *myLabel = [[UILabel alloc] init]; 
     [myLabel setText:@"Hello world"]; 
     [self addSubview:myLabel]; 
    } 

    return self; 
} 

- (void)layoutSubviews 
{ 
    [super layoutSubviews]; 
    RCTAssert(self.subviews.count == 1, @"we should only have exactly one subview"); 
} 

- (void)insertReactSubview:(UIView *)view atIndex:(NSInteger)atIndex 
{ 
    RCTLogError(@"FBLoginButton does not support subviews"); 
    return; 
} 

- (void)removeReactSubview:(UIView *)subview 
{ 
    RCTLogError(@"FBLoginButton does not support subviews"); 
    return; 
} 

- (NSArray *)reactSubviews 
{ 
    return @[]; 
} 

@end 

index.ios.js

var React = require('react-native'); 
var { 
    StyleSheet, 
    NativeModules, 
    requireNativeComponent, 
    NativeMethodsMixin, 
} = React; 

var { StripeManager } = NativeModules; 

var SuperStripe = React.createClass({ 

    mixins: [NativeMethodsMixin], 

    render: function() { 
    var props = { 
     ...this.props, 
     style: ([styles.base, this.props.style]), 
    }; 

    return <RCTStripe {...props} /> 
    }, 
}); 

var RCTStripe = requireNativeComponent('RCTStripe', SuperStripe); 

var styles = StyleSheet.create({ 
    base: { 
    width: 300, 
    height: 300, 
    }, 
}); 

module.exports = SuperStripe; 

的完整代碼在https://github.com/lrettig/react-native-stripe。在example/目錄內，運行npm install和npm start，然後打開example/ios/example.xcodeproj並運行它。

謝謝。

Answer 1

事實證明，這是因爲我從一個不同名稱的現有模塊開始，我重命名了Xcode項目。當我重命名Xcode項目時，由於某種原因，它從父項目（示例）項目的構建階段的「鏈接二進制庫」部分刪除了模塊項目（RCTStripe），因此代碼根本沒有運行。加回來修復了這一點。