函数在NavigatorIOS中调用onRightButtonPress - React Native [英] Function to call onRightButtonPress in NavigatorIOS - React Native

问题描述

我在反应原生NavigatorIOS中使用onRightButton。
我希望能够调用驻留在我所推送的组件中的函数，但是我无法实现该功能。
这是一个代码示例：

  this.props.navigator.push（{
 component： SingleResultView，
 title：SomeTitle，
 rightButtonIcon：require（'image！mapsmarker'），
 passProps：{
 userPosition：this.props.userPosition 
} ，
 onRightButtonPress：（）=> {SingleResultView.foo（）;} // NOT WORKING！
}）; 
  

我该如何做？

解决方案

ref 回调prop是你的朋友！ https://facebook.github.io/react/docs/ more-about-refs.html＃the-ref-callback-attribute

  goToResults（）{
 this.props.navigator.push（{
 component：SingleResultView，
 title：SomeTitle，
 rightButtonIcon：require（'image！mapsmarker'），
 passProps：{ 
 userPosition：this.props.userPosition，
 ref：this.onResultsRef，
}，
 onRightButtonPress：（）=> {this._resultsView&& this._resultsView .foo（）;} 
}）; 
} 
 
 onResultsRef（resultsViewRef）{
 this._resultsView = resultsViewRef; 
} 
  

I'm using the onRightButton in a react-native NavigatorIOS. I'd like to be able to call a function which resides into the component I'm pushing, but I can't get how to achieve that. This is an example of code:

this.props.navigator.push({
  component: SingleResultView,
  title: "SomeTitle",
  rightButtonIcon: require('image!mapsmarker'),
  passProps: {
    userPosition: this.props.userPosition
  },
  onRightButtonPress: () => { SingleResultView.foo(); } // NOT WORKING!
});

How can I do that?

解决方案

The ref callback prop is your friend! https://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute

  goToResults() {
    this.props.navigator.push({
      component: SingleResultView,
      title: "SomeTitle",
      rightButtonIcon: require('image!mapsmarker'),
      passProps: {
        userPosition: this.props.userPosition,
        ref: this.onResultsRef,
      },
      onRightButtonPress: () => { this._resultsView && this._resultsView.foo(); }
    });
  }

  onResultsRef(resultsViewRef) {
    this._resultsView = resultsViewRef;
  }

这篇关于函数在NavigatorIOS中调用onRightButtonPress - React Native的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！