Çözüldü: Yönlendirici dom IndexRedirect tepki

React Router DOM IndexRedirect ile ilgili temel sorun, beklenmedik yönlendirmelere neden olabilmesidir. Bunun nedeni, IndexRedirect bileşeninin, kullanıcıları bir web sitesinin kök URL'sine eriştiklerinde otomatik olarak belirli bir rotaya yönlendirmesidir. Bu, ana sayfayı veya diğer içeriği kök URL'de görmeyi bekleyen kullanıcılar için kafa karıştırıcı olabilir. Ek olarak, bir kullanıcı zaten belirli bir sayfaya gittiyse ve ardından tarayıcısını yenilerse, bir IndexRedirect bileşeni nedeniyle beklenmedik bir şekilde o sayfadan başka bir yere yönlendirilebilir.

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'dan { BrowserRouter as Router, Route, IndexRedirect } içe aktarın;” – Bu satır, tepki-yönlendirici-dom kitaplığından BrowserRouter, Route ve IndexRedirect bileşenlerini içe aktarır.

2. "” – Bu satır, bir React uygulaması için yönlendirme ayarlamak için kullanılan bir Yönlendirici bileşenindeki tüm yolları sarar.

3. "” – Bu hat, yolu '/' olan bir rota kurar. Bu yola yapılan tüm istekler bu rota tarafından işlenecektir.

4. "” – Bu satır, tüm istekleri '/' yoluna '/home' yoluna yönlendirir.

5. "” – Bu hat, yolu '/home' olan bir rota oluşturur. Bu yola yönelik herhangi bir istek, Route bileşenine bir argüman olarak iletilen Home bileşeni tarafından işlenecektir.

6. "” – Bu hat, yolu '/about' olan bir rota oluşturur. Bu yola yapılan herhangi bir istek, Route bileşenine bir bağımsız değişken olarak iletilen Hakkında bileşeni tarafından işlenecektir.

7.”” & “” – Bu satırlar sırasıyla hem rotaları hem de yönlendirici bileşenlerini kapatır

IndexRedirect nedir?

IndexRedirect, React Router'da bir rotadan diğerine yönlendirme yapmanızı sağlayan bir bileşendir. Kullanıcıyı uygulamanızın kök URL'sinden başka bir rotaya yönlendirmek istediğinizde kullanılır. Örneğin, kök URL'si "/" olan bir uygulamanız varsa, kullanıcıyı kök URL'yi ziyaret ettiğinde "/home"a yönlendirmek için IndexRedirect'i kullanabilirsiniz.

IndexRedirect nasıl yapılır?

React Router'daki IndexRedirect, kullanıcıları uygulamanızın kök URL'sinden başka bir URL'ye yönlendirmenin bir yoludur. Bu, kullanıcıları uygulamanızın en önemli sayfasına yönlendirmek veya bir açılış sayfası oluşturmak için yararlı olabilir.

React Router'da IndexRedirect yapmak için, bileşen. Bu bileşen iki destek alır: "to" ve "itme". "To" prop, kullanıcıların yönlendirilmesini istediğiniz URL'yi belirtmek için kullanılırken, "push" prop, bu yönlendirme gerçekleştiğinde tarayıcı geçmişinin güncellenip güncellenmeyeceğini belirler (varsayılan olarak doğrudur).

Örneğin, kök URL'nizi (ör. www.example.com) ziyaret eden kullanıcıların www.example.com/home adresine yönlendirilmesini istiyorsanız, şöyle bir IndexRedirect kullanabilirsiniz:

… diğer yollar …