在React Native中如何从子组件调用父函数并将参数从子组件传递到父组件?

Question

我在父屏幕中创建了一个带有12个参数的函数，并从子组件调用该函数，并从子组件传递参数，但它不起作用，并且无限时间地呈现屏幕

例如:

// This is my Array:
const [DataArray, setDataArray] = useState([
{
title: 'Saudi Arabia',
guest: '2 Guests',
description: 'This is my Description',
location: 'Riadh, KSA',
estimateCost: '$1000',
duration: '1 Month',
groupSize: 'small',
hostedIn: 'Michigan',
includes: '2 Return Tickets',
date: '12 July 2022',
notes: 'N/A',
locationDetails: 'House # 12, Makhdoom street, Al-Riadh, KSA',
},
]);

父屏功能:

// Add cards function.
const AddCard = (a, b, c, d, e, f, g, h, i, j, k, l) => {
let array = DataArray;
array.unshift({
title: a,
guest: b,
description: c,
location: d,
estimateCost: e,
duration: f,
groupSize: g,
hostedIn: h,
includes: i,
date: j,
notes: k,
locationDetails: l
});
setDataArray(array);
modalVisibleOff;
};

子组件从我调用函数

<TouchableOpacity
onPress={AddCard(
Title,
Guest,
Description,
Location,
EstimateCost,
Duration,
GroupSize,
HostedIn,
Includes,
Date,
Notes,
LocationDetails,
)}
style={styles.Button}>
<Text style={styles.ButtonText}>Submit</Text>
</TouchableOpacity>

Answer 1

在子组件中，您立即调用AddCart函数。下面是更新后的代码

<TouchableOpacity
onPress={() => AddCard(
Title,
Guest,
Description,
Location,
EstimateCost,
Duration,
GroupSize,
HostedIn,
Includes,
Date,
Notes,
LocationDetails,
)}
style={styles.Button}>
<Text style={styles.ButtonText}>Submit</Text>
</TouchableOpacity>