সমাধান করা হয়েছে: activeClassName প্রতিক্রিয়া রাউটার

রিঅ্যাক্ট রাউটারে ActiveClassName সম্পর্কিত প্রধান সমস্যা হল রুট পরিবর্তন হলে এটি স্বয়ংক্রিয়ভাবে সক্রিয় ক্লাস আপডেট করে না। এর মানে হল যে যখনই কোনও রুট পরিবর্তন হয় তখন বিকাশকারীদের অবশ্যই সক্রিয় ক্লাস আপডেট করতে হবে, যা সময়সাপেক্ষ এবং ত্রুটি-প্রবণ হতে পারে। অতিরিক্তভাবে, যদি একাধিক রুট একে অপরের মধ্যে নেস্টেড থাকে তবে কোন রুট বর্তমানে সক্রিয় রয়েছে এবং প্রতিটি উপাদানে কোন ক্লাস প্রয়োগ করা উচিত তা ট্র্যাক করা কঠিন হয়ে উঠতে পারে।

<Router>
  <Link to="/about" activeClassName="active">About</Link>
</Router>

1. দ্য React এ একটি রাউটার তৈরি করতে কম্পোনেন্ট ব্যবহার করা হয় যা ব্যবহারকারীদের বিভিন্ন পৃষ্ঠার মধ্যে নেভিগেট করতে দেয়।

2. দ্য কম্পোনেন্ট একটি লিঙ্ক তৈরি করতে ব্যবহৃত হয় যা ক্লিক করা হলে, ব্যবহারকারীকে "টু" অ্যাট্রিবিউটে নির্দিষ্ট পৃষ্ঠায় নিয়ে যাবে (এই ক্ষেত্রে, "/ সম্পর্কে")।

3. ActiveClassName অ্যাট্রিবিউট উল্লেখ করে যে লিঙ্কটি সক্রিয় থাকলে কোন শ্রেণী প্রয়োগ করা উচিত (এই ক্ষেত্রে, "সক্রিয়")।

NavLink কি

NavLink হল একটি রিঅ্যাক্ট কম্পোনেন্ট যা রিঅ্যাক্ট রাউটারে একটি অ্যাপ্লিকেশনের বিভিন্ন রুটের মধ্যে একটি নেভিগেশন লিঙ্ক তৈরি করতে ব্যবহৃত হয়। এটি লিঙ্ক উপাদানের অনুরূপ, কিন্তু এটি বর্তমান URL এর সাথে মেলে যখন এটি রেন্ডার করা উপাদানটিতে স্টাইলিং বৈশিষ্ট্য যোগ করে। NavLink একটি ActiveClassName প্রপও প্রদান করে যা লিঙ্কের রুট সক্রিয় থাকাকালীন একটি ক্লাস নাম প্রয়োগ করতে ব্যবহার করা যেতে পারে।

ActiveClassName অ্যাট্রিবিউট

রিঅ্যাক্ট রাউটারে ActiveClassName অ্যাট্রিবিউটটি একটি ক্লাসের নাম নির্দিষ্ট করতে ব্যবহার করা হয় যা এলিমেন্টে প্রয়োগ করা হবে যখন এটি বর্তমান URL এর সাথে মেলে। লিঙ্ক বা নেভিগেশন আইটেমগুলি বর্তমান রুটের সাথে মেলে তখন এটি স্টাইলিং করার জন্য দরকারী। এটি রাউটিংয়ের সাথে সরাসরি সম্পর্কিত নয় এমন উপাদানগুলিতে অতিরিক্ত স্টাইলিং যোগ করতেও ব্যবহার করা যেতে পারে, যেমন একটি নেভিগেশন বারে বর্তমানে সক্রিয় ট্যাব হাইলাইট করা।

ActiveClassName কেন কাজ করবে না

ActiveClassName হল রিঅ্যাক্ট রাউটারের একটি বৈশিষ্ট্য যা আপনাকে নেভিগেশন মেনুতে সক্রিয় লিঙ্কে একটি ক্লাস যোগ করতে দেয়। দুর্ভাগ্যবশত, এটি প্রতিক্রিয়া রাউটারে কাজ করবে না কারণ এটি ব্রাউজারের ইতিহাস API এর উপর নির্ভর করে, যা প্রতিক্রিয়া রাউটারে উপলব্ধ নয়। এর মানে হল যে কোনও ব্যবহারকারী কখন কোনও লিঙ্কে ক্লিক করেছে এবং সেই অনুযায়ী ActiveClassName প্রয়োগ করেছে প্রতিক্রিয়া রাউটার সনাক্ত করতে পারে না।

সম্পর্কিত পোস্ট:

মতামত দিন