1. ホーム
  2. javascript

[解決済み】React-Router 外部リンク

2022-02-18 08:17:32

質問内容

reactアプリでルートを処理するためにreact-routerを使用しているので、外部リソースにリダイレクトする方法があるかどうか気になります。

誰かがヒットしたとします。

example.com/privacy-policy

にリダイレクトさせたいのですが。

example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies

私のindex.htmlの読み込みにプレーンなJSで以下のようなことを書くのを避けるために、全くゼロの助けを見つけることができました。

if ( window.location.path === "privacy-policy" ){
  window.location = "example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies"
}

解決するには?

実は、Componentを自作することになったんです。 <Redirect> の情報を取得します。 react-router

<Route
  path="/privacy-policy"
  component={ Redirect }
  loc="https://meetflo.zendesk.com/hc/en-us/articles/230425728-Privacy-Policies"
  />

import React, { Component } from "react"; export class Redirect extends Component { constructor( props ){ super(); this.state = { ...props }; } componentWillMount(){ window.location = this.state.route.loc; } render(){ return (<section>Redirecting...</section>); } } export default Redirect;

react-router: 3.0.5

EDIT -- 注意。 これは {コード 4.xではそう単純ではありません。