Question

我有一个视图，我希望用户能够选择多个项目。选择项目后，我希望他们点击右上角的“完成”，然后转到下一个屏幕。使用Swift我连接到prepareForSegue和segue.destinationViewController来实现它。

使用React Native，我使用NavigatorIOS onRightButtonPress函数，但不确定如何访问在passProps中使用的View数据。

目前代码如下：

return (<NavigatorIOS
  ref="nav"
  style={styles.nav}
  initialRoute={{
    nav: this.refs.nav,
    component: this.props.onSuccessView,
    title: 'What Would You Like To Do?',
    rightButtonTitle: 'Next',
    onRightButtonPress: () => {this.refs.nav.navigator.push({
          title: "Where To Go",
          backButtonTitle: 'Back',
          component: SuggestionsView
       });
    }
  }}
/>);

我想要的是this.props.onSuccessView.onRightButtonPress来处理应该调用哪个组件并提供道具。这可能吗？

如果没有，我可以调用诸如props之类的函数：this.props.onSuccessView.getProps（）？

欢迎任何建议！

由于

本

Answer 1

这闻起来很怪异。你确定这是你想做的吗？为什么不从父组件传递一个回调，该组件具有你在这里展示的孩子的意识 - 然后你可以通过抓住孩子并对他们采取行动来使用你所需要的参考。

或者：查看NavigatorIOS的the example，看看如何使用路由器 - pop和push方法确实更适合你在这里尝试做的事情。

Answer 2

一个。在初始组件中

this.props.navigator.push({
    title: 'title',
    component: MyComponent,
    rightButtonTitle: 'rightButton',
    passProps: {
        ref: (component) => {this.pushedComponent = component},
    },
    onRightButtonPress: () => {
        // Access View Data
        this.pushedComponent && this.pushedComponent.props.someObject...;
    },
});

B中。在推动组件中在推送的组件中替换onRightButtonPress func。

componentDidMount: function() {
    // get current route
    var route = this.props.navigator.navigationContext.currentRoute;
    // update onRightButtonPress func
    route.onRightButtonPress =  () => {
        // Access View Data
        this.props.someObject...
    };
    // component will not rerender
    this.props.navigator.replace(route);
},

NavigatorIOS onRightButtonPress访问视图数据

2 个答案: