React-Router を使用して外部リンクにリダイレクトする方法

RedirectLinks は、ルート管理に React-Router を使用するアプリケーションに課題をもたらします。シングルページ アプリケーション (SPA) コンテキスト内で動作するためです。これに対処するために、ユーザーを外部リソースにシームレスにリダイレクトするソリューションを紹介します。

/privacy-policy にアクセスしているユーザーを example.zendesk.com/hc/en-us/articles/123456789 にリダイレクトしたいと仮定します。 -プライバシー-ポリシー。プレーンな JavaScript は if ステートメントを使用してこれを実現できますが、React-Router はより洗練されたアプローチを提供します。

単一行ソリューションの紹介:

 {
    window.location.href = 'https://example.com/1234';
    return null;
}} />

この React の純粋なコンポーネントの概念は、コンポーネントのコードを 1 つの関数に凝縮します。マークアップをレンダリングする代わりに、ブラウザを外部 URL にリダイレクトするだけです。

この手法は React Router 3 と 4 の両方と互換性があり、外部リンクのリダイレクトを React ベースのアプリケーションに簡単に統合できます。