প্রতিক্রিয়া নেটিভ এক পৃষ্ঠা থেকে অন্য পৃষ্ঠায় নেভিগেশন পরিচালনা কিভাবে?

অ্যাপটিতে কাজ করার সময়, আমরা একটি স্ক্রীন থেকে অন্য স্ক্রীনে যেতে চাই এবং এটি প্রতিক্রিয়া নেভিগেশন দ্বারা পরিচালিত হয়৷

পৃষ্ঠাগুলি নেভিগেট করার জন্য আমাদের নিম্নরূপ কয়েকটি প্যাকেজ ইনস্টল করতে হবে -

npm @react-navigation/native @react-navigation/stacknpm ইনস্টল @react-native-community/masked-view react-native-screens react-native-safe-area-context react-native-gesture-handler 

 একবার আপনি উপরের ইনস্টলেশনটি সম্পন্ন করার পরে আসুন এখন আমরা নেভিগেশনের পরবর্তী সেটআপে প্রতিক্রিয়া নেটিভ নিয়ে এগিয়ে যাই।
 

 আপনার অ্যাপ প্রকল্পে pages/ নামে একটি ফোল্ডার তৈরি করুন। 2টি js ফাইল তৈরি করুন HomePage.js এবং AboutPage.js৷
৷ 

 পৃষ্ঠা/HomePage.js 
 'react' থেকে প্রতিক্রিয়া হিসাবে 
import *; import { Button, View, Alert, Text } থেকে 'react-native';const HomeScreen =({ navigation }) => { return (  navigation.navigate('About', { name:'About Page' })}/> );};ডিফল্ট হোমস্ক্রিন রপ্তানি করুন;
 

 হোম পেজে, আমরা এখানে ক্লিক করে শিরোনাম সহ একটি বোতাম প্রদর্শন করতে চাই। বোতামে ক্লিক করলে ব্যবহারকারী AboutPage স্ক্রিনে নেভিগেট করবেন।
 

 AboutPage এর বিশদ বিবরণ নিম্নরূপ -
 

 পৃষ্ঠা/AboutPage.js 
 'react' থেকে প্রতিক্রিয়া হিসাবে 
import *; import { Button, View, Alert, Text } থেকে 'react-native';const AboutPage =() => { প্রত্যাবর্তন আপনি প্রায় পৃষ্ঠার ভিতরে পৌঁছেছেন!;};এক্সপোর্ট ডিফল্ট AboutPage;
 

 প্রায় পৃষ্ঠায় আমরা উপরে দেখানো টেক্সটটি প্রদর্শন করছি।
 

 এখন আমরা App.js-এর পৃষ্ঠাগুলিকে নিম্নরূপ −
 কল করি 

 পৃষ্ঠাগুলিকে নিম্নরূপ বলা হয় -
 
'./pages/HomePage' থেকে হোমপেজ আমদানি করুন;'./pages/AboutPage' থেকে AboutPage আমদানি করুন;
 

 উপরন্তু আমাদের @react-navigation/native থেকে NavigationContainer আমদানি করতে হবে একটি নেভিগেশন কন্টেইনার হিসেবে কাজ করবে। @react-navigation/stack থেকে createStackNavigator যোগ করুন।
 

 নিচের দেখানো হিসাবে createStackNavigator() করার জন্য একটি কল করুন -
 
const Stack =createStackNavigator();
 

 এখন আপনি মূল ধারক হিসাবে  ব্যবহার করে এই স্ট্যাকে পৃষ্ঠাগুলি যোগ করতে পারেন। Stack.Navigation আপনার অ্যাপকে স্ক্রিনের মধ্যে পরিবর্তন করতে সাহায্য করে যেখানে প্রতিটি নতুন স্ক্রিন স্ট্যাকের উপরে রাখা হয়।
 
 

 হোমপেজ স্ক্রিনের জন্য একটি স্ট্যাক তৈরি করতে এটি নিম্নরূপ করা হয় -
 
 

 AboutPage স্ক্রিনের জন্য একটি স্ট্যাক তৈরি করতে, এটি নিম্নরূপ করা হয় -
 
 

 এখানে সম্পূর্ণ কোড রয়েছে যা নেভিগেশন স্ক্রিনে প্রতিক্রিয়া নেটিভ −
-এ সাহায্য করে 
'react' থেকে প্রতিক্রিয়া হিসাবে * আমদানি করুন; '@react-navigation/native' থেকে { NavigationContainer } আমদানি করুন; '@react-navigation/stack' থেকে { createStackNavigator } আমদানি করুন; './pages/HomePage' থেকে হোমপেজ আমদানি করুন;'./pages/AboutPage' থেকে AboutPage আমদানি করুন;const Stack =createStackNavigator();const MyStack =() => { ফেরত (   );};ডিফল্ট রপ্তানি করুন মাইস্ট্যাক;