Netlify React のリダイレクトに問題があります。 リダイレクトを作成すると、Netlify は HTML ドキュメントの href および path コンポーネントを自動的に更新しようとします。 ただし、このプロセスにより、リンクが正しくなかったり壊れたりする場合があります。
Netlify React プロジェクトでリダイレクトの問題が発生している場合は、href コンポーネントとパス コンポーネントの自動更新を無効にすることをお勧めします。 これを行うには、プロジェクトの構成で次のプロパティを設定します。
netlify-react-redirect-auto-update: false
app
In your React app, you can redirect to a different page using the Redirect component from React Router.
import { Redirect } from 'react-router-dom'; class App extends React.Component { render() { return ( <div> <Redirect to="/new-page" /> </div> ); } }
ネットリファイとは
Netlify は、開発者が Web アプリケーションを構築および展開するのに役立つサービスとしてのプラットフォーム (PaaS) です。 これは、開発者が XNUMX つのコマンドで Web アプリケーションを作成、管理、デプロイするためのプラットフォームを提供します。 Netlify は、アプリケーションを監視および管理するためのツールも提供します。
React でのリダイレクト
ルータ
React Router でルートを作成するとき、従うリダイレクトを指定できます。 このリダイレクトは、ユーザーがルートにアクセスすると自動的に行われます。
React Router でリダイレクトを作成するには、リダイレクト機能を使用します。 この関数は XNUMX つの引数を取ります: たどるパスと、ユーザーがリダイレクト先に到達したときに呼び出されるハンドラー関数です。 ハンドラー関数は、 status と url の XNUMX つのプロパティを持つオブジェクトを返す必要があります。 status プロパティにはリダイレクトの HTTP ステータス コードが含まれている必要があり、url プロパティにはユーザーに表示される新しい URL が含まれている必要があります。
リダイレクトを使用する単純なルートの例を次に示します。
'react' から React をインポートします。 import { Route } from 'react-router' ; import { Redirect } from 'react-router-dom' ; const routes = [ { path : '/users/:id' , component : UserList , children : [ { path : '/add' , component : AddUser }, { path : '/delete/:id' , component : DeleteUser } ] }, { パス: '/users/:id/edit' , コンポーネント: EditUserList } ]; デフォルトのルートをエクスポートします。 作成 (ルート);
