React-Native Touchable press event does not respond after clicking on stack

My test is simple.

In didFinishLaunchingWithOptions, I create a UINavigationController and a UIViewController that contains an RCTRootView. Then push the UIViewController onto the UINavigationController stack.

#import "AppDelegate.h"
#import "RCTRootView.h"

UINavigationController* theNavi = nil;

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    NSURL *jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle"];
    RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                        moduleName:@"TouchableFeedbackEvents"
                                                     launchOptions:launchOptions];

    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    UIViewController *rootViewController = [[UIViewController alloc] init];
    rootViewController.view = rootView;

    UINavigationController* nav = theNavi = [[UINavigationController alloc] init];
    [nav pushViewController:rootViewController animated:YES];

    self.window.rootViewController = nav;
    [self.window makeKeyAndVisible];
    return YES;
}

@end

And I write bridges that can load another RCTRootView, and push the new UIViewController to the navigation controller.

#import "ReactNativeBridger.h"
#import "RCTRootView.h"

extern UINavigationController* theNavi;

@implementation ReactNativeBridger

- (void)startReactApp:(NSString*)componentName title:(NSString*)title
{
    RCT_EXPORT();

    NSURL *jsCodeLocation;
    jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle"];

    RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                        moduleName:componentName
                                                     launchOptions:@{}];


    UIViewController* vc = [[UIViewController alloc] init];
    vc.view = rootView;
    vc.title = title;

    dispatch_async(dispatch_get_main_queue(), ^{
        [theNavi pushViewController:vc animated:YES];
    });
}

@end

Js just does one thing. When the script is clicked, the startReactApp method is called and the new RCTRootView is pressed.

'use strict';

var React = require('react-native');
var {
    StyleSheet,
    AppRegistry,
    Text,
    TouchableOpacity,
    View,
} = React;

var ReactNativeBridger = require('NativeModules').ReactNativeBridger;

var TouchableFeedbackEvents = React.createClass({
                                                getInitialState: function() {return {};},

                                                render: function() {
                                                return (
                                                        <View style={{top: 100}}>
                                                        <TouchableOpacity
                                                        style={styles.wrapper}
                                                        onPress={() => this._press('press')}>
                                                        <Text style={styles.button}>Press Me</Text>
                                                        </TouchableOpacity>
                                                        </View>
                                                        );
                                                },
                                                _press: function(eventName) {
                                                ReactNativeBridger.startReactApp('TouchableFeedbackEvents', 'AAAA');}
                                                });

var styles = StyleSheet.create({
                               row: {
                               justifyContent: 'center',
                               flexDirection: 'row',
                               },
                               button: {
                               color: '#007AFF',
                               },
                               wrapper: {
                               borderRadius: 8,
                               },
                               });

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

The first view works fine. Click the button, another image will be pressed. But when I click the same button in the second view, nothing happens. He cannot answer my press.

+2
source share

All Articles