親コンポーネントにパラメータを指定してコールバックを渡す

Question

私はおそらく些細なことを聞​​いていますが、しばらく私を悩ませています。

我々はいくつかのボタンをレンダリング子コンポーネントを持っているとしましょう：私はそれらのいずれかのボタンを押したときに

const Picker = ({ data, label, visible, cancelCallback, onPressCallback }) => { 

    function renderRow (data) { 
    return data.map((el) => { 
     return (
     <TouchableOpacity 
      style={listViewItemContainer} 
      key={el.label} 
      onPress={} 
     > 
      <Text style={listViewItem}> { el.label } </Text> 
     </TouchableOpacity> 
    ); 
    }); 
    } 

    return (
    <Modal 
     visible={visible} 
     animationType="fade" 
     onRequestClose={() => {}} 
     transparent={true} 
    > 


      <View style={listViewContainerStyle}> 
      { renderRow(data) } 
      </View> 


    </Modal> 
); 
}; 

は今、私は親にコールバックを作りたいが、私はラベルのようないくつかのパラメータを渡したいです押された要素の次のようなものがあります。

<TouchableOpacity 
    style={listViewItemContainer} 
    key={el.label} 
    onPress={onPressCallback(el.label)} // onPressCallback is a Prop passed to the child 
> 
    <Text style={listViewItem}> { el.label } </Text> 
</TouchableOpacity> 

そして、親コンポーネントのロジックを処理します。 どうすればいいですか？

Answer 1

このようにします。

onPress={() => onPressCallback(el.label)}