ইউআরএল রিঅ্যাক্ট রাউটারে প্যারামিটার যোগ করার সাথে সম্পর্কিত প্রধান সমস্যা হল যে প্যারামিটারগুলি ব্যবহারকারীদের দ্বারা সহজেই ম্যানিপুলেট করা যেতে পারে। এটি নিরাপত্তা সংক্রান্ত সমস্যার কারণ হতে পারে, কারণ দূষিত ব্যবহারকারীরা সম্ভাব্যভাবে অননুমোদিত সংস্থান বা ডেটাতে অ্যাক্সেস পেতে প্যারামিটার ব্যবহার করতে পারে। অতিরিক্তভাবে, যদি প্যারামিটারের মানগুলি সঠিকভাবে যাচাই করা না হয়, তাহলে এটি অ্যাপ্লিকেশনে অপ্রত্যাশিত আচরণের দিকে নিয়ে যেতে পারে। অবশেষে, যদি অনেকগুলি প্যারামিটার যোগ করা হয়, তাহলে এটি URL এর জটিলতার কারণে পারফরম্যান্সের সমস্যা সৃষ্টি করতে পারে।
import {
BrowserRouter as Router,
Route,
Link,
useParams
} from "react-router-dom";
<Router>
<Route path="/user/:username">
<User />
</Route>
<Link to="/user/john">John</Link>
function User() {
let { username } = useParams();
return (
<div>{username}</div> // renders 'john' when the link is clicked.
);
}
</Router>
1. "react-router-dom" থেকে { BrowserRouter as Router, Route, Link, useParams} আমদানি করুন;
// এটি প্রতিক্রিয়া-রাউটার-ডোম লাইব্রেরি থেকে উপাদানগুলি আমদানি করে যা এই কোডে ব্যবহার করা হবে।
2.
3.
4.
5. John // এটি /user/john রুটের একটি লিঙ্ক তৈরি করে যা ক্লিক করার সময় ব্যবহারকারীর নাম প্যারামিটার হিসাবে 'john' সহ ব্যবহারকারীর উপাদান রেন্ডার করবে।
6. ফাংশন User() { //এটি একটি কার্যকরী উপাদান যা একটি যুক্তি হিসাবে ব্যবহারকারীর নাম নেয় এবং এটির উপরের লিঙ্কে ক্লিক করার মাধ্যমে এটিকে div ট্যাগের ভিতরে রেন্ডার করে।
7. চলুন { username } = useParams(); //এটি useParams() থেকে ব্যবহারকারীর নাম অ্যাক্সেস পেতে destructuring ব্যবহার করে।
8. প্রত্যাবর্তন (
); //এটি একটি ডাইভ এলিমেন্ট রিটার্ন করে যেখানে ব্যবহারকারীর নামের মধ্যে যা কিছু মান পাস করা হয়েছিল তা এই ক্ষেত্রে 'জন' হবে।
রিঅ্যাক্ট রাউটার কি
রিঅ্যাক্ট রাউটার হল রিঅ্যাক্ট অ্যাপ্লিকেশনের জন্য একটি রাউটিং লাইব্রেরি। এটি বিভিন্ন পৃষ্ঠার মধ্যে নেভিগেশন সহ একটি একক-পৃষ্ঠা অ্যাপ্লিকেশন (SPA) তৈরি করার জন্য প্রয়োজনীয় মূল উপাদান এবং ফাংশন সরবরাহ করে। এটি বিকাশকারীদেরকে রুটগুলি সংজ্ঞায়িত করার অনুমতি দেয়, যা এমন পাথ যা অ্যাপ্লিকেশনের নির্দিষ্ট উপাদানগুলির সাথে মানচিত্র করে। রিঅ্যাক্ট রাউটার রিডাইরেক্ট, ডাইনামিক রুট ম্যাচিং এবং কোয়েরি প্যারামিটারের মতো বৈশিষ্ট্যও প্রদান করে।
URL থেকে প্যারামিটার
রিঅ্যাক্ট রাউটারে ইউআরএলের প্যারামিটার ডেভেলপারদের ইউআরএল থেকে রিঅ্যাক্ট কম্পোনেন্টে ডায়নামিক ডেটা পাঠাতে দেয়। এটি ডায়নামিক রুট তৈরি করার জন্য দরকারী যা URL এ পাস করা পরামিতিগুলির উপর ভিত্তি করে বিভিন্ন বিষয়বস্তু প্রদর্শনের জন্য ব্যবহার করা যেতে পারে। উদাহরণস্বরূপ, "/user/:id" এর মতো একটি রুট ইউআরএলে পাস করা একটি আইডি প্যারামিটার সহ ব্যবহারকারীর প্রোফাইল পৃষ্ঠা প্রদর্শন করতে ব্যবহার করা যেতে পারে। প্যারামিটারগুলি ফিল্টারিং ডেটা বা অন্যান্য ক্রিয়াকলাপগুলির জন্যও ব্যবহার করা যেতে পারে যার জন্য URL থেকে গতিশীল ডেটা প্রয়োজন৷
আমি কীভাবে প্রতিক্রিয়াতে একটি URL এ একটি প্যারামিটার যুক্ত করব
রিঅ্যাক্ট রাউটারে একটি ইউআরএলে প্যারামিটার যোগ করা "প্যারামস" অবজেক্ট ব্যবহার করে করা হয়। এই অবজেক্টটি আপনাকে কী-মানের জোড়ায় পাস করতে দেয় যা URL-এ যোগ করা হবে। একটি প্যারামিটার যোগ করতে, এটিকে প্যারাম অবজেক্টে যোগ করুন যেমন:
const params = { param1: 'value1', param2: 'value2' };
তারপর, আপনার রুট তৈরি করার সময়, আপনি প্যারাম অবজেক্টে একটি যুক্তি হিসাবে পাস করতে পারেন:
এই রুটে নেভিগেট করার সময় পরামিতিগুলি URL-এ যোগ করা হবে।
