2017-08-20 126 views
0

我正在將本機Swift模塊橋接到React Native中。我創建了一個UIView,它創建了一個帶有目標處理程序的UIButton。它正確渲染所有內容,但單擊該按鈕不會觸發任何內容。我在這裏舉辦了演示:https://github.com/esbenp/react-native-swift-testReact-Native:無法觸發原生UIButton觸摸事件

我的本機模塊是相當簡單:https://github.com/esbenp/react-native-swift-test/blob/master/ios/TestModuleManager.m

#import <React/RCTViewManager.h> 
#import "ReactNativeSwiftTest-Swift.h" 

@interface TestModuleManager : RCTViewManager 
@end 

@implementation TestModuleManager 

RCT_EXPORT_MODULE() 

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

@end 

然後在JS運行:https://github.com/esbenp/react-native-swift-test/blob/master/ios/TestModule.swift

let Button = UIButton(frame: CGRect(x: 0, y: 0, width: 200, height: 50)) 
Button.setTitleColor(UIColor.blue, for: .normal) 
Button.setTitle("Press me", for: .normal) 
Button.addTarget(self, action: #selector(TestModule.onClick), for: .touchUpInside) 

self.addSubview(Button) 

我用管家橋它https://github.com/esbenp/react-native-swift-test/blob/master/index.ios.js

我不是iOS專家,但它似乎與框架有關。如果我採取相同的本機模塊,並用它在一個正常的iOS項目UIViewController像這樣:

override func viewDidAppear(_ animated: Bool) { 
    super.viewDidAppear(animated) 

    let Button = TestModule(frame: CGRect(x: 0, y: 0, width: 500, height: 500)) 

    self.view.addSubview(Button) 
} 

它的工作原理。我假設這是因爲React Native創建的框架是width=0height=0(至少如果我是NSLog(String(describing: frame.size.height)),這樣說)。

iOS MapView example指定不覆蓋該框架,因爲React Native會設置該框架。我不知道這個框架是不是錯了,還是我錯過了一些其他的背景?我嘗試了#2948#15097的指示,但沒有任何幫助。

回答

0

我在這裏發現了錯誤。事實證明,您必須將flex: 1添加到JS端的實際本地組件,以使框架正確填寫。

以前

export default class ReactNativeSwiftTest extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Test /> 
     </View> 
    ); 
    } 
} 

export default class ReactNativeSwiftTest extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Test style={{flex: 1}} /> 
     </View> 
    ); 
    } 
}