將帶參數的回調傳遞給父組件

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)}