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

React Router DOM IndexRedirect সম্পর্কিত প্রধান সমস্যা হল এটি অপ্রত্যাশিত পুনঃনির্দেশের কারণ হতে পারে। এর কারণ হল IndexRedirect কম্পোনেন্ট স্বয়ংক্রিয়ভাবে ব্যবহারকারীদের একটি নির্দিষ্ট রুটে রিডাইরেক্ট করে যখন তারা কোনো ওয়েবসাইটের রুট ইউআরএল অ্যাক্সেস করে। এটি ব্যবহারকারীদের জন্য বিভ্রান্তিকর হতে পারে যারা মূল URL-এ হোমপেজ বা অন্যান্য বিষয়বস্তু দেখার আশা করছেন। উপরন্তু, যদি একজন ব্যবহারকারী ইতিমধ্যেই একটি নির্দিষ্ট পৃষ্ঠায় নেভিগেট করে থাকে এবং তারপরে তাদের ব্রাউজার রিফ্রেশ করে, তাহলে একটি IndexRedirect উপাদানের কারণে অপ্রত্যাশিতভাবে সেই পৃষ্ঠা থেকে দূরে পুনঃনির্দেশিত হতে পারে।

import { BrowserRouter as Router, Route, IndexRedirect } from "react-router-dom";

<Router>
  <Route path="/">
    <IndexRedirect to="/home" />
    <Route path="/home" component={Home} />
    <Route path="/about" component={About} />
  </Route>  
</Router>

1. "'react-router-dom' থেকে { BrowserRouter রাউটার, রুট, IndexRedirect } হিসাবে আমদানি করুন;" – এই লাইনটি রিঅ্যাক্ট-রাউটার-ডোম লাইব্রেরি থেকে BrowserRouter, Route এবং IndexRedirect উপাদান আমদানি করে।

2. "” – এই লাইনটি একটি রাউটার কম্পোনেন্টে সমস্ত রুটকে মোড়ানো হয় যা একটি প্রতিক্রিয়া অ্যাপ্লিকেশনের জন্য রাউটিং সেট আপ করতে ব্যবহৃত হয়।

3. "” – এই লাইনটি '/' এর একটি পথ সহ একটি রুট সেট আপ করে। এই পথের যেকোনো অনুরোধ এই রুট দ্বারা পরিচালিত হবে।

4. "” – এই লাইনটি যেকোন অনুরোধকে '/' পাথে '/ হোম'-এ পুনঃনির্দেশ করে।

5. "” – এই লাইনটি '/home' এর একটি পথ সহ একটি রুট সেট আপ করে। এই পথের যেকোন অনুরোধ হোম কম্পোনেন্ট দ্বারা পরিচালিত হবে যা রুট কম্পোনেন্টের যুক্তি হিসাবে পাস করা হয়।

6. "” – এই লাইনটি '/about' এর একটি পথ সহ একটি রুট সেট আপ করে। এই পাথের যেকোনও অনুরোধ এবাউট কম্পোনেন্ট দ্বারা পরিচালিত হবে যা রুট কম্পোনেন্টের আর্গুমেন্ট হিসাবে পাস করা হয়।

7."" এবং "" - এই লাইনগুলি যথাক্রমে রুট এবং রাউটার উভয় উপাদান বন্ধ করে দেয়

IndexRedirect কি

IndexRedirect হল রিঅ্যাক্ট রাউটারে একটি উপাদান যা আপনাকে এক রুট থেকে অন্য রুটে রিডাইরেক্ট করতে দেয়। এটি ব্যবহার করা হয় যখন আপনি ব্যবহারকারীকে আপনার অ্যাপ্লিকেশনের রুট URL থেকে অন্য রুটে পুনঃনির্দেশ করতে চান। উদাহরণস্বরূপ, যদি আপনার কাছে “/” এর রুট ইউআরএল সহ একটি অ্যাপ্লিকেশন থাকে, তাহলে ব্যবহারকারীরা যখন রুট ইউআরএলে যান তখন আপনি তাকে “/হোম”-এ পুনঃনির্দেশ করতে IndexRedirect ব্যবহার করতে পারেন।

কিভাবে IndexRedirect করবেন

রিঅ্যাক্ট রাউটারে IndexRedirect হল ব্যবহারকারীদের আপনার অ্যাপ্লিকেশনের রুট ইউআরএল থেকে অন্য ইউআরএলে রিডাইরেক্ট করার একটি উপায়। এটি ব্যবহারকারীদের আপনার অ্যাপ্লিকেশনের সবচেয়ে গুরুত্বপূর্ণ পৃষ্ঠায় নির্দেশিত করার জন্য বা একটি ল্যান্ডিং পৃষ্ঠা তৈরি করার জন্য উপযোগী হতে পারে।

React রাউটারে IndexRedirect করতে, আপনাকে ব্যবহার করতে হবে উপাদান. এই উপাদান দুটি প্রপস লাগে: "থেকে" এবং "ধাক্কা"। "টু" প্রপটি ইউআরএলটি নির্দিষ্ট করতে ব্যবহার করা হয় যেখানে আপনি ব্যবহারকারীদের পুনঃনির্দেশিত করতে চান, যখন "পুশ" প্রপ নির্ধারণ করে যে এই পুনঃনির্দেশটি ঘটলে ব্রাউজার ইতিহাস আপডেট করা উচিত কিনা (ডিফল্টরূপে সত্য)।

উদাহরণস্বরূপ, আপনি যদি চান যে ব্যবহারকারীরা আপনার রুট ইউআরএল (যেমন, www.example.com) যান তাদের www.example.com/home এ পুনঃনির্দেশিত করা হোক, আপনি এইভাবে একটি IndexRedirect ব্যবহার করতে পারেন:

… অন্যান্য রুট …