如何調用從父列表視圖中的子組件的功能

Question

我從（父組件）的ListView導航：

rowPressed(element) { 
    this.props.navigator.push({ 
      title: element.title, 
      rightButtonSystemIcon: 'action', 
    onRightButtonPress:() => { 
     // how to call my function _handleRightButtonPress() ? 
    }, 
      component: ElementDetail, 
      passProps: { 
      element: element 
      } 
     }); 
    } 

我想在ElementDetail組件調用_handleRightButtonPress（）：

class ElementDetail extends Component { 

    constructor(props) { 
    super(props); 
    ... 
    } 

    _handleRightButtonPress() { 
    console.log('right Button Pressed'); 
    }; 

... 

} 

任何想法如何做到這一點？

Answer 1

最簡單的方法是父母將一個功能傳遞給孩子。孩子可以使用該功能與父母溝通。

的父母會傳遞一個函數給孩子做道具，像這樣：

<MyChild myFunc={this.handleChildFunc.bind(this)} /> 

而且孩子會調用該函數，像這樣：

this.props.myFunc(); 
And don't forget that the child will need this function declared in its propTypes: 

MyChild.propTypes = { 
    myFunc: React.PropTypes.func, 
}; 

有關之間的溝通更多詳情組件請參閱Link