রিঅ্যাক্ট রাউটার ইউআরএল প্যারামের সাথে সম্পর্কিত প্রধান সমস্যা হল যে তারা গতিশীল রুটে ব্যবহার করা কঠিন হতে পারে। কারণ ইউআরএল প্যারামগুলি স্ট্যাটিক এবং রুট তৈরি হওয়ার পরে পরিবর্তন করা যায় না। এর মানে হল যে যদি একজন ব্যবহারকারীকে বিভিন্ন প্যারামিটার সহ একটি ভিন্ন পৃষ্ঠা অ্যাক্সেস করতে হয়, তাহলে তাদের প্রতিটি প্যারামিটার সমন্বয়ের জন্য একটি নতুন রুট তৈরি করতে হবে। উপরন্তু, URL প্যারাম ব্যবহার করার সময়, সমস্ত সম্ভাব্য সংমিশ্রণের ট্র্যাক রাখা এবং প্রতিটি রাউটার দ্বারা সঠিকভাবে পরিচালনা করা হয়েছে তা নিশ্চিত করা কঠিন হতে পারে।
import {
BrowserRouter as Router,
Route,
Link,
useParams
} from "react-router-dom";
const App = () => {
return (
<Router>
<div>
<Route path="/user/:username" component={UserPage} />
</div>
</Router>
);
};
const UserPage = () => {
let { username } = useParams(); // Get the username from the URL.
return (
<div>Hello, {username}!</div> // Render a greeting with the username.
);
};
এই কোডটি URL থেকে একটি ব্যবহারকারীর নাম সহ একটি পৃষ্ঠা রেন্ডার করার জন্য একটি প্রতিক্রিয়া রাউটার সেট আপ করছে৷
1. প্রথম লাইনটি প্রতিক্রিয়া রাউটার DOM লাইব্রেরি থেকে উপাদান আমদানি করে।
2. অ্যাপ ফাংশন রাউটার কম্পোনেন্টকে এর ভিতরে একটি রুট কম্পোনেন্ট দিয়ে রিটার্ন করে, যা নির্দিষ্ট করে যে "/user/" দিয়ে শুরু হওয়া যেকোনো ইউআরএল ইউজারপেজ কম্পোনেন্ট রেন্ডার করবে।
3. ইউজারপেজ ফাংশন ইউআরএল থেকে ইউজারনেম পেতে useParams() ব্যবহার করে এবং তারপর সেই ইউজারনেম ব্যবহার করে একটি শুভেচ্ছা রেন্ডার করে।
URL প্যারাম
রিঅ্যাক্ট রাউটারে URL প্যারামগুলি হল ডেটার টুকরো যা URL-এর অংশ হিসাবে একটি রুটে পাঠানো হয়। তারা বিকাশকারীদের একটি রুটে গতিশীল তথ্য প্রেরণ করার অনুমতি দেয়, যেমন একটি আইডি বা ক্যোয়ারী স্ট্রিং। এটি গতিশীল রুট তৈরি করতে ব্যবহার করা যেতে পারে যা ডাটাবেস থেকে নির্দিষ্ট আইটেম প্রদর্শন বা ব্যবহারকারীর ইনপুটের উপর ভিত্তি করে সামগ্রী ফিল্টার করার মতো জিনিসগুলির জন্য ব্যবহার করা যেতে পারে। রিঅ্যাক্ট রাউটার ইউআরএল প্যারামে অ্যাক্সেস এবং ম্যানিপুলেট করার জন্য টুল সরবরাহ করে, এটি আপনার অ্যাপ্লিকেশনে ব্যবহার করা সহজ করে তোলে।
আপনি কীভাবে প্রতিক্রিয়াতে একটি রুট থেকে URL প্যারামগুলি পাবেন
রিঅ্যাক্ট রাউটারে, আপনি ইউজ প্যারাম হুক ব্যবহার করে একটি রুট থেকে URL প্যারামগুলি অ্যাক্সেস করতে পারেন। এই হুক ইউআরএল প্যারামিটারের কী-মানের জোড়া সমন্বিত একটি বস্তু প্রদান করে। উদাহরণস্বরূপ, যদি আপনার রুট /user/:id হয়, আপনি useParams().id দিয়ে আইডি প্যারামিটার অ্যাক্সেস করতে পারেন।
