javascript - React Native Navigator Right Button Action

使用 Navigator ，我需要一个右键按钮来修改顶级 View 的状态。
使用 Navigator 和自定义 NavigationBarRouteMapper ，除了按钮操作之外，我能够实现所有这些。

使用这个 Navigator 实现:

         <Navigator
            ref='navigator'
            style={styles.appContainer}
            initialRoute={{name: initialRootView.title, component: initialRootView.view}}
            navigationBar={
              <Navigator.NavigationBar
                routeMapper={NavigationBarRouteMapper}
                style={styles.navBar}
              />
            }
            configureScene={() => {
                return Navigator.SceneConfigs.FloatFromRight;
            }}
            renderScene={(route, navigator) => {
                if (route.component) {
                    // add `navigator` and `cache` as props to any top-level component that gets pushed
                    // onto the navigation stack.
                    return React.createElement(route.component, { navigator: navigator, cache: this.state.cache, ...route.props });
                }
            }}
          />

这个 NavigationBarRouteMapper :

var NavigationBarRouteMapper = {
  RightButton: function(route, navigator, index, navState) {
    console.log(route.component);
    return (
      <TouchableOpacity
        onPress={route.component.onRightButton}
        style={{width: 100, height: 44, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Right Button</Text>
      </TouchableOpacity>
    );
  },
};

这将正确呈现右侧按钮，并且我的顶级组件具有函数 onRightButton 。但是为什么它永远不会被调用？

在 RightButton 的上下文中进行一些调试， route.component.prototype.hasOwnProperty('onRightButton') 返回 true 但 route.component.hasOwnProperty('onRightButton') 返回 false 。这怎么可能？返回的 route.component 引用有什么奇怪的？

任何帮助表示赞赏。

最佳答案

作为路线的一部分，您可以通过任何您想要的东西。例如:
initialRoute={{name: initialRootView.title, component: initialRootView.view onRightButton: (() => {console.log('hi')})}}
然后您可以通过以下方式在 RightButton 内访问它:
onPress={route.onRightButton}
在您的示例中，您试图从组件的 React 组件类访问一个函数，该函数不会公开该函数。

关于javascript - React Native Navigator Right Button Action，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33760796/