لتمرير القائمة المحدثة للغرف من مكون AddRoom إلى مكون ListRoom، يمكنك استخدام React Navigation للانتقال إلى شاشة ListRoom وتمرير القائمة المحدثة كمعلمة.
فيما يلي نسخة محدثة من التعليمات البرمجية الخاصة بك تتضمن التغييرات الضرورية:
في AddRoom Component :
1. قم باستيراد useNavigation من React Navigation.
import { useNavigation } from '@react-navigation/native';
2. قم بتحديث السطر الذي تنتقل فيه إلى شاشة ListRoom لتمرير القائمة المحدثة كمعلمة.
const navigation = useNavigation();
// ...
navigation.navigate('ListRoom', { updatedList: updateList });
في ListRoom Component :
1. قم بالوصول إلى القائمة المحدثة من معلمات التنقل.
import { useRoute } from '@react-navigation/native';
// ...
const route = useRoute();
const { updatedList } = route.params;
2. استخدم القائمة المحدثة في المكون الخاص بك لعرض الغرف المحدثة.
<View style={styles.container}>
{updatedList.map(room => (
<TouchableOpacity key={room.id}>
<List
text={room.NameOfroom}
date={room.date}
number={room.Numberofroom}
/>
</TouchableOpacity>
))}
</View>
مع هذه التغييرات، سيتلقى مكون ListRoom القائمة المحدثة للغرف من مكون AddRoom ويعرضها وفقًا لذلك.
ملاحظة: تأكد من إعداد React Navigation بشكل صحيح في مشروعك حتى يعمل هذا الحل.
لتمرير القائمة المحدثة للغرف من مكون AddRoom إلى مكون ListRoom، يمكنك استخدام React Navigation للانتقال إلى شاشة ListRoom وتمرير القائمة المحدثة كمعلمة. فيما يلي نسخة محدثة من التعليمات البرمجية الخاصة بك تتضمن التغييرات الضرورية: في AddRoom Component : 1. قم باستيراد useNavigation من React Navigation. import { useNavigation } from '@react-navigation/native'; 2. قم بتحديث السطر الذي تنتقل فيه إلى شاشة ListRoom لتمرير القائمة المحدثة كمعلمة. const navigation = useNavigation(); // ... navigation.navigate('ListRoom', { updatedList: updateList }); في ListRoom Component : 1. قم بالوصول إلى القائمة المحدثة من معلمات التنقل. import { useRoute } from '@react-navigation/native'; // ... const route = useRoute(); const { updatedList } = route.params; 2. استخدم القائمة المحدثة في المكون الخاص بك لعرض الغرف المحدثة. <View style={styles.container}> {updatedList.map(room => ( <TouchableOpacity key={room.id}> <List text={room.NameOfroom} date={room.date} number={room.Numberofroom} /> </TouchableOpacity> ))} </View> مع هذه التغييرات، سيتلقى مكون ListRoom القائمة المحدثة للغرف من مكون AddRoom ويعرضها وفقًا لذلك. ملاحظة: تأكد من إعداد React Navigation بشكل صحيح في مشروعك حتى يعمل هذا الحل.